Il molo si muove sul compositore, e una finestra che si muove non re-render più lo strumento dentro di esso

Performancekamo-internal
Spegnimento
17 settembre 2026 alle ore 19:43 UTC
Autore
Kamo
Impegno
905fba8

Tutto su una finestra di strumento popup che MOVES - ri-confezione della riga, luoghi di trading con una striscia cliccare, uscire di fila dietro, una resistenza, una cucitura tirare, prendere e lasciare il pannello massimizzato - costava un pass di layout e un completo React re-render di ogni finestra aperta per frame. Misurato nell'imbracatura del bacino con otto finestre aperte (rom senza testa, prima/dopo, tre piste ciascuno): - un clic su una striscia: 12-14 passa layout -> 1, tempo di script 87-104ms -> 44-52ms - a 40-move title-bar drag: 168 re-renders di finestra CONTENTS -> 0, e 86 layout forzato legge -> 3 - strati di filtro dello sfondo in realtà dipinte: 8 su 8 -> 5 di 8 (solo le finestre in piedi dietro) Ogni finestra termina allo stesso pixel, e ogni transizione viaggia lo stesso percorso sullo stesso frames: dock->float, float->dock, dock->maximizzato e massimizzato->dock tutti i campioni identici endpoint, identici conteggi dei frame mobili e identici passaggi più grandi. L'unica differenza di pixel riposo è la fase di antialiasing subpixel sui bordi del glifo in finestre attraccate - stesse posizioni, stesse peso corsa (2649 vs 2643 pixel di inchiostro), stessa energia bordo (5.47 vs 5.53). Che cosa è cambiato: - Una finestra attraccata è posizionata da `translate` invece di `left`/`top`, con il sollevatore del hover ripiegato in. Gli altri tre regimi mantengono `left`/`top` e nessun traduttore affatto, e il hand-off è esatto perché tutti `left`, `top` e `translate` condividono già un orologio di transizione: due rampe su una curva somma alla rampa tra gli endpoint. Deliberatamente no `will-change` - non ha comprato nulla o sonda potrebbe vedere e costa uno strato compositor per finestra per la sessione. - `relayoutWindows` risponde all'array SAME quando nulla si muove. Ha sempre risposto alle stesse finestre e una matrice fresca, in modo che ogni uno dei quindici-odd chiamanti di `store.relayout()` - compreso il sync barra di scorrimento che esegue 120ms dopo qualsiasi mutazione DOM ovunque nel documento - ri-rendered ogni lettore della lista delle finestre. - `useToolWindowsStable()`: la lista delle finestre con la sua geometria ignorata. I sette corpi degli strumenti, tre ponti non letti e l'osservatore di successo tutti lo leggono per un pezzo booleano e nessuno ha mai leggere una scatola, quindi una resistenza di altezza non re-renders più ogni elenco di messaggi sullo schermo. - `useToolWindowActions()`: i callback, per identità, quindi un caller che solo spedisce non è re-rendered da una finestra in movimento. - `readViewport()` tiene la sua giusta misura tra gli eventi che possono cambiarlo. The la chiamata di render-phase in ToolDock stava svuotando un layout sporco sessanta volte al secondo durante una resistenza. - `DockedToolWindow` e `ToolWindowBody`: un limite di memo per finestra e per strumento, con ogni una volta per la vita della finestra. Memoized `MaximizedTabStrip`, `MaximizedTab`, `ChatNavigatorPanel`, `DockSnapIndicator`, `HexHeadSpring` e `HexHeadPopover` pure. - Il `backdrop-filter` del velo della striscia è `visibilità: nascosta` quando la finestra non è dietro. Si'. transizioni discretamente, quindi la dissolvenza gioca ancora in pieno prima che lo strato smetta di essere dipinto. - Il ciclo di lancio hexhead non più zecche React stato per frame; i percorsi comet eseguire il proprio cornice di animazione e scrivere attributi SVG, quindi un tiro smette di ridare l'intera fase. - Lo spazzamento di arrivo della barra del titolo si abbatte quando finisce invece di parcheggiare fuori-frame per la sessione, e i keyframe del framer della shell sono memoizzati - tre dei cinque rami restituiscono un keyframe ARRAY, quindi un ri-render mid-swap usato per riavviare il cross-dissolve. `dockRenderCost.test.tsx` indica tutto come conta; il caso di identità di relayout fallisce su HEAD.

Tutte le modifiche

Come quello che vedi la spedizione?

Tutto questo arriva nel vostro spazio di lavoro da solo. Iniziare sul piano gratuito e leggere di nuovo questa pagina in un mese.

Inizia gratis per sempreVisualizza il prezzo