Sobes.tech
Junior

Miks skriptid tavaliselt lisatakse body märgi lõppu?

sobes.tech AI

Vastus AI-lt

Selleks, et vältida lehe renderdamise blokeerimist ja tagada DOM elementidele juurdepääs kohe pärast nende laadimist.

Kui skripte lisatakse <head> või <body> alguses ilma async või defer atribuutideta, peatab brauser HTML-i analüüsi ja lehe renderdamise kuni skript on laaditud ja täidetud. See aeglustab nähtavat saidi jõudlust.

Skripti lisamine <body> lõpus tagab, et DOM puu on juba täielikult loodud, võimaldades otse suhelda elementidega ilma, et oleks vaja kasutada sündmuste käsitlejaid nagu DOMContentLoaded või load ainult elementidele juurdepääsuks.

async ja defer atribuudid on kaasaegsed alternatiivid, mis pakuvad paindlikumaid võimalusi skriptide laadimiseks, ilma HTML-i analüüsi blokeerimata:

  • async: Skript laaditakse asünkroonselt ja täidetakse kohe pärast laadimist, ilma ootamata DOM-i täielikku laadimist. Asünkroonsete skriptide täitmise järjekord ei ole garanteeritud.
  • defer: Skript laaditakse asünkroonselt ja täidetakse pärast HTML-i täielikku analüüsi, kuid enne DOMContentLoaded sündmust. Skriptid defer-iga täidetakse nende ilmumise järjekorras dokumendis.