¿Por qué necesitas hacer compatibilidad con el navegador? –La función del motor de renderizado en el navegador.
- Arquitectura del navegador web
Interfaz de usuario: interfaz de usuario. Permite a los usuarios finales interactuar con todos los elementos visuales en la interfaz.
Motor del navegador: motor del navegador. Es el componente central del motor del navegador y actúa como un intermediario entre la interfaz de usuario y el motor de renderizado. Consulta y procesa el motor de renderizado de acuerdo con los comandos de entrada recibidos desde la interfaz de usuario.
Motor de renderizado: Motor de renderizado. Responsable de presentar páginas web específicas solicitadas por los usuarios en sus pantallas. Cada navegador tiene su propio motor de representación único. Para diferentes versiones de navegador, el motor de representación puede ser diferente.
Redes: red. Este componente es responsable de administrar las llamadas de red utilizando protocolos estándar (Http o FTP), y es responsable de manejar los problemas de seguridad relacionados con las comunicaciones de Internet.
Intérprete de JavaScript: intérprete JS. Es responsable de analizar y ejecutar el código JS incrustado en el sitio web, generar el resultado, reenviarlo al motor de representación y mostrarlo en la interfaz de usuario.
UI Backend: UI backend. El usuario dibuja widgets básicos (ventanas y cuadros combinados).
Almacenamiento / persistencia de datos: almacenamiento / persistencia de datos. El navegador web necesita almacenar varios tipos de datos localmente, como las cookies, por lo que el navegador debe ser compatible con mecanismos de almacenamiento de datos como WebSQL, IndexedDB y FileSystem. - ¿Cuál es el papel del motor de renderizado?
Cuando el usuario solicita un documento específico, el motor de representación comienza a obtener el contenido del documento solicitado, que se realiza a través de la capa de red. El motor de renderizado comienza a recibir el contenido de un documento específico en unidades de 8 kb de la capa de red. El siguiente es el flujo básico del motor de representación:
(1) El motor de representación analiza páginas HTML (incluidos archivos CSS y elementos de estilo) en forma de bloques, y luego convierte los elementos HTML en nodos DOM para formar un "árbol de contenido" o "árbol DOM".
(2) Construye un árbol de Render. El árbol incluye información de estilo e instrucciones visuales que definen el orden de visualización de los elementos para garantizar que el contenido se muestre en el orden deseado.
(3) Proceso de diseño El proceso de calcular los valores de coordenadas de los nodos. En este proceso, cada nodo se asigna con coordenadas exactas, lo que puede garantizar que cada nodo aparezca en una posición precisa en la pantalla.
(4) Dibuja la pantalla. Usando el método paint () en el renderizador, use la capa de fondo de la interfaz de usuario para dibujar cada nodo en la pantalla.
Como se mencionó anteriormente, cada navegador tiene su propio motor de renderizado único. Entonces, relativamente, cada navegador tiene su propia forma de interpretar la página web en la pantalla del usuario. Para los desarrolladores web, existe un desafío con respecto a la compatibilidad entre navegadores de sus sitios web.
Prueba cruzada del navegador La prueba cruzada del navegador
es un método de garantía de calidad utilizado para verificar la consistencia de las aplicaciones web en términos de funcionalidad y diseño en múltiples navegadores. Estas pruebas permiten al equipo de control de calidad explorar cualquier problema a través de pruebas de diseño receptivo, que pueden ocurrir cuando su sitio web pasaDiferentes navegadoresOVersión del navegadorAl visitar
Clasificación del kernel del navegador
- Tridente [IE core]: IE
- Webkit: Safari
- Gecko: Firefox
- Blink: Chrome (anteriormente Webkit, ahora Blink, convirtiéndose en el núcleo de Chrome), Opera
fork en Webkit - Trident + Webkit: Sogo, 360, qq, Baidu, Aoyou, etc.
Tipos de navegador: navegador de un solo núcleo, navegador de doble núcleo - reproducido en https://blog.csdn.net/zhiyuan411/article/details/89098539 - Modo de velocidad de navegador de doble núcleo (núcleo de Webkit) + modo de compatibilidad (núcleo de Trident) El núcleo de
Webkit es ligero, eficiente y rápido; el núcleo de Trident tiene un rendimiento de compatibilidad muy bueno en diversas situaciones, como la banca en línea
(1) La velocidad predeterminada es más rápida El núcleo de Webkit tiene problemas de compatibilidad y permite a los usuarios cambiar manualmente al núcleo de Trident.
(2) Para sitios web especiales como banca en línea y Alipay, los navegadores de doble núcleo generalmente adoptan tecnología de conmutación inteligente, es decir, cuando se detectan estos sitios, cambiarán automáticamente al modo de compatibilidad
(3) Al implementar el núcleo de WebKit, por ejemplo: después de que se actualiza el núcleo de Chrome, El navegador de doble núcleo debe obtener el código fuente del núcleo de Chrome, volver a compilar y probar su navegador, y luego actualizar el navegador de doble núcleo para actualizar el núcleo de Chrome. Debido al tiempo excesivo y al costo de mano de obra de la actualización sincrónica, existe una gran diferencia de tiempo entre el navegador general de doble núcleo y la última versión de Chrome. La versión central de WebKit del navegador de doble núcleo es mucho más antigua
(dándose cuenta de Trident En el núcleo, el navegador de doble núcleo usa el control de control web del sistema operativo de Microsoft como núcleo (el navegador IE también usa el control de control web como el núcleo), por lo que cuando el IE del sistema se actualiza o se aplica un parche de actualización, el navegador de doble núcleo automáticamente tendrá Además de estas protecciones de seguridad u optimizaciones de rendimiento, el modo de compatibilidad y el IE del navegador de doble núcleo tienen un mayor grado de coherencia. En
resumen, para los navegadores domésticos, se debe dar prioridad y atención a garantizar la regresión de la prueba en el modo de velocidad.
Navegador móvil
¿Cómo probar la compatibilidad del navegador?
- Especifique el grupo de usuarios objetivo del producto, sus comportamientos, etc.
- Estadísticas de preguntas de comentarios
- Otros
