Heb je je ooit afgevraagd wat er allemaal nodig is om een webpagina in je browser te laden? Afhankelijk van uw internetverbinding, voert u de URL of het adres van een webpagina in en drukt u op de knop "Enter" om vrijwel onmiddellijk naar die webpagina te gaan. Het kan een langzamer proces zijn bij langzamere verbindingen, maar u kunt nog steeds relatief snel naar een pagina gaan. Wat gebeurt er achter de schermen om dat allemaal te laten gebeuren? Volg hieronder en we laten je zien wat er aan de hand is!
Server naar browser communicatie
In de termen van de leek, wanneer u een link in uw adresbalk invoert of op een link op een pagina klikt, doet de browser een verzoek aan de server waarop het adres wordt gehost. Van daaruit worden de bronnen voor de pagina gedownload en gebruikt de browser deze bronnen om de pagina weer te geven en het uiteindelijke product aan u weer te geven.
Het is echter iets ingewikkelder dan dat.
Een kort woord over URL's
Wanneer u een URL typt, zoals www.google.com, is dat precies wat u ziet. De computer ziet iets anders. Zodra u dat typt en op Enter drukt, reist het door een Domain Name Server (DNS) en converteert het naar een IP-adres - iets wat de computer kan lezen. Dus hoewel u www.google.com misschien ziet, neemt de browser dat door, geeft het een DNS-server door en dan maakt u daadwerkelijk verbinding met een van de vele IP-adressen van Google, zoals 216.58.216.110 . Je zou eigenlijk 216.58.216.110 in de adresbalk kunnen typen en op dezelfde locatie kunnen eindigen.
Een webpagina in uw browser krijgen
Er zijn veel bewegende delen om een webpagina correct in uw browser weer te geven. De eerste stap is echter het verzoek. U doet een verzoek aan een webserver wanneer u het adres typt van een site die u wilt bezoeken, zoals www.techjunkie.com. Zodra u op Enter drukt, maakt uw browser verbinding met de webhost en vraagt u een aantal tekstbestanden aan om te downloaden.
De volgende stap is het antwoord van de webserver. Dit is de stap waarbij de server de middelen daadwerkelijk aan de browser levert. De browser vraagt erom (het verzoek) en de server stuurt ze om (het antwoord). Hoe weet een browser echter of hij meer nodig heeft dan slechts één bestand? Het doet dit via iets dat parsing wordt genoemd. Met andere woorden, de browser neemt het eerste document en zoekt naar verwijzingen naar andere bestanden. Als het een verwijzing naar een ander bestand ziet, wordt het ook gedownload. Het is een stuk ingewikkelder dan dat, maar dat is de kern van hoe het alle benodigde bestanden vindt.
Vervolgens moet alle gedownloade informatie worden gebouwd. Het neemt het originele HTML-document dat het heeft gedownload, evenals alle relevante bronnen en creëert een soort structuur of structuur. Eerst wordt een Document Object Map (DOM) gebouwd, die in wezen de structuur of plaatsing van elementen op een pagina is. Vervolgens bouwt het de CSS Object Map - de structuur voor hoe elementen in de DOM worden gestileerd. Ten slotte maakt het de Render Tree, die in feite de DOM en de CSS Object Map gebruikt, combineert en een structuur creëert voor hoe de pagina is gestructureerd en gestileerd.
En ten slotte wordt de pagina vervolgens weergegeven en weergegeven aan u, de gebruiker. Er zijn ook veel berekeningen in deze stap, omdat de browser moet uitzoeken hoe groot de lay-out is ten opzichte van uw scherm (paginagroottes zullen bijvoorbeeld verschillen als u een tablet, smartphone of computer gebruikt). Maar zodra dit het geval is, krijgt u een definitieve en hopelijk mooie pagina weergegeven in uw browser.
Het proces is eigenlijk heel verbazingwekkend - al deze verzoeken en berekeningen gebeuren allemaal in een kwestie van seconden, afhankelijk van hoe snel je internetverbinding natuurlijk is. Maar voor het grootste deel, hoewel er honderden bestanden op een webpagina kunnen staan, gebeurt het bovenstaande proces gemakkelijk in 10 seconden of minder.
Sluitend
Hopelijk hebben we duidelijk uitgelegd hoe uw internetverbinding, de browser en de servers allemaal samenwerken om u webpagina's rechtstreeks in uw browser te bezorgen. Door een dieper inzicht te krijgen in hoe al deze technologieën met elkaar verweven en samenwerken, krijgt u niet alleen meer waardering voor wat er achter de schermen gebeurt, maar kunt u ook problemen met browsers oplossen.
