En primer lugar, no estoy interesado en todo el proceso de petición-respuesta tratado por esta cuestión¿Describe el proceso de representación de página en un navegador?
Quiero saber lo que ocurre dentro de un navegador, una vez que reciba la respuesta HTML desde el servidor. La intención detrás de hacer esta pregunta es comprender los detalles internos de las secuencias de comandos del lado del cliente. También sería beneficioso si puede explicar en conceptos abstractos de qué se compone un navegador web. Puede llamarlos como motor de CSS, motor de JavaScript, etc. El objetivo es visualizar con precisión el desarrollo web que estoy haciendo.
Desafortunadamente, no encontré ningún recurso web que trate este problema. Por favor, perdónenme si hay recursos que explican estos conceptos. Puede señalar los recursos (libros, etc.) si esta pregunta es demasiado exhaustiva como para responderla.
[código fuente webkit] (http://www.webkit.org/building/checkout.html)/[código fuente de Mozilla] (https://developer.mozilla.org/en/Download_Mozilla_Source_Code) – Quentin
Estoy buscando una descripción abstracta que ayude a un desarrollador web promedio a visualizar el proceso de scripting del lado del cliente. Estoy seguro de que incluso si uno escribe mozilla desde cero, también visualizaría esto de una manera abstracta. – pphanireddy
@pphanireddy, he leído "Cómo funcionan los navegadores" y me pregunto cuándo analizará html y encontrará
Siga los siguientes pasos y debe tener en cuenta el ciclo de vida de la solicitud y cómo se rinde la respuesta
Escribe una URL en la barra de direcciones en su navegador preferido.
El navegador analiza la URL para encontrar el protocolo, el host, el puerto y la ruta.
Se forma una petición HTTP (que era más probable es que el protocolo)
llegar a la máquina, primero se tiene que traducir el anfitrión legible por humanos en un número IP, y lo hace esto haciendo un DNS las operaciones de búsqueda en el host
Entonces necesita un zócalo para abrirse desde el ordenador del usuario a ese número IP, en el puerto especificado (lo más a menudo el puerto 80)
Cuando una conexión está abierta, la solicitud de HTTP es enviado al host El host reenvía la solicitud al servidor s oftware (más a menudo Apache) configurado para escuchar en el puerto especificado
El servidor inspecciona la solicitud (la mayoría de las veces solo la ruta) y ejecuta el complemento necesario para manejar la solicitud (correspondiente al idioma del servidor que utiliza, PHP, Java, .NET, Python?)
El complemento obtiene acceso a la solicitud completa y comienza a preparar una respuesta HTTP.
Para construir la respuesta, se accede (muy probablemente) a una base de datos.Se realiza una búsqueda de base de datos, basada en parámetros en la ruta (o datos) de la solicitud
Los datos de la base de datos, junto con otra información que el complemento decide agregar, se combinan en una larga cadena de texto (probablemente HTML)
El complemento combina esos datos con algunos metadatos (en forma de encabezados HTTP) y envía la respuesta HTTP de vuelta al navegador.
el navegador recibe la respuesta, y analiza el código HTML (que con un 95% se rompe probabilidad) en la respuesta
Un árbol DOM se construye fuera del HTML roto
nuevas peticiones son hecho al servidor para cada recurso nuevo que se encuentra en el código fuente HTML (típicamente imágenes, hojas de estilo y archivos JavaScript).
Regrese al paso 3 y repita para cada recurso.
hojas de estilo son analizadas, y la información de representación en cada uno se apega al nodo correspondiente en el árbol DOM
JavaScript es interpretada y ejecutada, y los nodos DOM se mueven y la información de estilo se actualiza en consecuencia
el navegador muestra la página en la pantalla según el árbol DOM y la información de estilo para cada nodo
ve la página en la pantalla
Te molesta que todo el proceso haya sido demasiado lento.
Fuente
2016-02-26 07:05:02
El navegador comienza a representar la página justo después de analizar el primer elemento HTML. Ciertamente no espera a que se complete el árbol DOM, mucho menos para que se carguen todos los recursos externos. Tal vez pueda editar su respuesta para aclarar que al menos algunos de los pasos 13-18 ocurren como una tubería (¿un elemento a la vez?), En lugar de hacerlo secuencialmente. – max