Rychlost Střední dopad Střední dle příčiny

Velikost DOM

Příliš mnoho HTML elementů zpomaluje vykreslování.

Co to je

DOM je strom HTML elementů stránky. Příliš velký nebo hluboce zanořený DOM (tisíce uzlů) zpomaluje vykreslování, layout a JavaScriptové operace.

Proč to řešit

Velký DOM zvyšuje spotřebu paměti a procesoru, zhoršuje interaktivitu a plynulost, hlavně na mobilech. Bývá příznakem nabobtnalých šablon nebo nadbytečných obalů.

Jak na to

1Zjednoduš strukturu: odeber zbytečné <div> obaly.
2U dlouhých seznamů/tabulek použij stránkování nebo virtualizaci.
3Nenačítej skrytý obsah, který není potřeba (renderuj až na vyžádání).

Závěr

Štíhlý DOM se rychleji vykresluje i ovládá. Orientačně drž počet uzlů v řádu nižších tisíců a vyhýbej se hlubokému zanoření. U datově bohatých stránek pomáhá virtualizace seznamů.

Související témata