In che modo un browser Web gestisce il contenuto JavaScript di una pagina Web? Il contenuto JavaScript viene analizzato in un DOM e quindi reso?In che modo i browser gestiscono JavaScript?
Non ho bisogno di una specifica, ma ho bisogno di sapere come è fatto. Per favore dimmi l'intero processo di gestione dei contenuti JavaScript su una pagina web.
Le sezioni script di una pagina Web vengono gestite dall'interprete JavaScript del browser, che può essere una parte intrinseca del browser ma di solito è un modulo distinto, a volte persino un progetto completamente distinto (Chrome utilizza V8; IE utilizza JScript; Firefox usa SpiderMonkey, ecc.).
Quando il parser HTML raggiunge un elemento script, tutto che il parser non fa altro che leggere e memorizzare il testo attraverso il finale </script> tag (o recuperare il file indicato tramite l'attributo src). Quindi, a meno che l'autore non abbia utilizzato lo defer or async attributes, tutte le analisi e il rendering dell'HTML vengono interrotti bruscamente e il parser HTML passa il testo dello script all'interprete JavaScript. L'interprete JavaScript interpreta il codice JavaScript nel contesto dell'oggetto window e al termine restituisce al parser HTML, che può quindi continuare l'analisi e la visualizzazione della pagina. Questo stop-everything-and-run-the-JavaScript è il motivo per cui alcune persone importanti recommend putting scripts at the bottom della pagina per migliorare il tempo di caricamento percepito. Significa anche che i tag script vengono elaborati nell'ordine, che può essere importante se uno script si basa su un altro. Se si utilizza l'attributo defer o async, l'esecuzione dello script può essere posticipata in un secondo momento sui browser che la supportano. Tutti gli script sulla pagina vengono eseguiti all'interno dello stesso contesto di esecuzione globale, condividendo lo stesso spazio dei nomi globale e l'area di memoria (e quindi possono interagire tra loro).
volta che la pagina viene analizzato e reso, una serie di eventi può verificarsi — l'utente può cliccare qualcosa, la finestra del browser può essere ridimensionata, il mouse può spostare sugli elementi. Il codice JavaScript che è stato eseguito come risultato di un tag script può "connettersi" a questi eventi, richiedendo che il browser chiami una funzione nel JavaScript quando si verifica l'evento. Ciò consente a JavaScript di essere interattivo — l'utente fa clic su un elemento nella pagina, ad esempio, e il browser dice all'interprete JavaScript che deve eseguire la funzione X nel codice JavaScript.
Come potete vedere sopra, ci sono due situazioni alquanto diverse in cui il codice JavaScript può essere eseguito: Durante la pagina di analisi/processo di rendering (quando un elemento script che non utilizza i defer o async attributi viene inizialmente elaborata) e dopo il il processo di analisi/rendering (script posticipati e codice in esecuzione in risposta a un evento). JavaScript in esecuzione durante il processo di analisi/rendering può inviare direttamente il contenuto al parser HTML tramite la funzione document.write. JavaScript in esecuzione dopo l'analisi/rendering non è completo, ovviamente, ma può utilizzare il potentissimo DOM HTML API per interagire con il DOM.
È probabilmente da notare l'elemento noscript: in un browser con JavaScript abilitato, gli elementi noscript vengono completamente ignorati. In un browser senza JavaScript o con JavaScript disabilitato, gli elementi script vengono completamente ignorati e vengono letti gli elementi noscript. Ciò semplifica l'inclusione di contenuti che verranno visualizzati solo se JavaScript è attivo o meno nel browser quando viene eseguito il rendering della pagina.
Letture consigliate: