Sobes.tech
Junior

Kodėl dažniausiai skriptai yra prijungiami prie body žymės pabaigos?

sobes.tech AI

Atsakymas iš AI

Siekiant išvengti puslapio atvaizdavimo blokavimo ir užtikrinti tiesioginę prieigą prie DOM elementų iškart po jų įkėlimo.

Prijungiant skriptus <head> arba <body> pradžioje be async arba defer atributų, naršyklė sustabdo HTML analizę ir puslapio atvaizdavimą iki tol, kol skriptas bus įkeltas ir įvykdytas. Tai sulėtina matomą svetainės našumą.

Prijungimas pabaigoje <body> užtikrina, kad DOM medis jau yra visiškai sukurtas, kai vykdomas skriptas, leidžiant tiesiogiai sąveikauti su elementais be poreikio naudoti įvykių tvarkytojus kaip DOMContentLoaded ar load tik prieigos tikslais.

async ir defer atributai yra šiuolaikinės alternatyvos, siūlančios lankstesnius būdus įkelti skriptus, neblokavus HTML analizės:

  • async: Skriptas įkeliamas asinchroniškai ir vykdomas iškart po įkėlimo, nesulaukiant pilno DOM įkėlimo. Asinchroninių skriptų vykdymo tvarka nėra garantuota.
  • defer: Skriptas įkeliamas asinchroniškai ir vykdomas po pilno HTML analizės, bet prieš DOMContentLoaded įvykį. Skriptai su defer vykdomi jų atsiradimo dokumente tvarka.