¿Cómo me veo bajo las sábanas y veo cómo se procesa HTML?

Question

Por ejemplo:

<input name="abutton" type="button" value="This is not a button" /> 

Sé que esto me da un botón. Pero también sé que alguien tuvo que descubrir qué tan ancho era mi texto, dibujar un botón del tamaño correcto, colocar mi texto allí ... etc.

Usemos Mozilla como ejemplo. Busqué en Google y encontré this, así que creo que estoy en el camino correcto. Aún así, la primera frase lo dice todo:

Página reorganización: El motor de diseño utilizado en Mozilla (que se conoce por muchos nombres) comenzó como un proyecto para escribir un nuevo motor de diseño para Mozilla y se convirtió en el motor de la disposición de Mozilla y las bases para una reescritura casi total, a finales de 1998.

confuso.

Aquí es una lista de piezas Sé existe (de esa página de Mozilla):

• HTML analizador y XML parser
• implementación DOM
• CSS sistema de estilo
• analizador HTML analizador yy Analizador XML
• Código para el diseño y la representación basada en CSS y HTML

¿Alguien puede explicar en términos sencillos cómo el modelo del navegador Mozilla muestra un botón?

Answer 1

Así que esta es realmente una pregunta muy, muy complicada. He trabajado en el proyecto Mozilla hace un par de años, así es como esto funciona a lo mejor de mi recuerdo: se analiza

1. HTML y en nodos como los especificados en el estándar DOM. Este árbol representa la estructura de los datos en el documento.
2. Desde ese árbol DOM, se construye otro árbol paralelo llamado árbol de marco. Este árbol representa la información visual en el árbol; aquí se implementan cosas como el modelo de caja.
3. Una vez que Mozilla resolvió todas las interdependencias y ha construido un árbol de cuadros satisfactorio, el árbol del marco se siente dolido. Aquí hay algunos pasos (ver árbol, árbol de widgets) que creo que ahora están desactualizados y, en cualquier caso, eran bastante específicos de Mozilla. El punto es que este árbol de marco se transfiere al subsistema de gráficos (que finalmente llama al sistema operativo) para procesar.

más moderno diseño de los navegadores páginas de forma incremental, por lo que todo esto está sucediendo especie de todos a la vez que se cargan varios recursos en ("reflujo" en términos de Mozilla), por lo que no es totalmente exacta.

Para información de Mozilla, recomendaría #developers en irc.mozilla.org. Para obtener información sobre WebKit, puede probar #webkit en chat.freenode.net.

Tenga en cuenta que ya no soy un desarrollador de Mozilla y no he tenido ninguna asociación con el proyecto desde 2008, por lo que es completamente posible que esté equivocado. Sientase libre de corregirme.