Motor de renderització

Un motor de navegador (també conegut com a motor de disseny o motor de renderització ) és un component de programa bàsic de tots els navegadors web principals. La tasca principal d'un motor de navegador és transformar els documents HTML i altres recursos d'una pàgina web en una representació visual interactiva al dispositiu d'un usuari.

Nom i àmbit d'aplicació

modifica

Paral·lelament a " motor del navegador", s'utilitzen habitualment altres dos termes relacionats: "motor de disseny" i "motor de renderització".[1][2][3] En teoria, el disseny i la renderització podrien ser gestionats per diferents motors. A la pràctica, però, aquests components estan estretament vinculats i rarament es troben sols fora del motor del navegador.[1] [4]

A part del disseny i la renderització, un motor de navegador fa complir la política de seguretat entre documents, gestiona la navegació a través d' hipervincles i dades enviades mitjançant formularis i implementa el Model d'objectes de document (DOM) exposat als scripts associats al document.[1] [4]

TTots els navegadors principals admeten JavaScript per oferir una àmplia gamma de comportaments dinàmics per a les pàgines web. Tanmateix, JavaScript s'implementa com un motor de JavaScript independent, que ha permès el seu ús en altres llocs. En un navegador, els dos motors es coordinen mitjançant els enllaços DOM i Web IDL.[4]

Els motors de navegador també s'utilitzen en aplicacions que no són navegadors. Un client de correu electrònic en necessita un per mostrar el correu electrònic HTML. A partir de la dècada de 2010, s'han creat moltes aplicacions amb els frameworks basats en el projecte Chromium de Google ; cadascuna d'aquestes aplicacions autònomes funciona com una aplicació web. (Dos exemples són Spotify i Slack.) [5][6]

Maquetació i renderització

modifica

El disseny d'una pàgina web normalment s'especifica mitjançant Fulls d'estil en cascada (CSS). Cada full d'estil és una sèrie de regles sobre com s'ha de presentar la pàgina. Per exemple, algunes regles especifiquen detalls de la tipografia, com ara el tipus de lletra, el color i la mida del text, mentre que d'altres determinen la ubicació de les imatges. El motor combina totes les regles CSS rellevants per calcular coordenades gràfiques precises per a la representació visual que pintarà a la pantalla.[1] [4]

Alguns motors poden començar a renderitzar abans que es baixin tots els recursos d'una pàgina. Això pot provocar canvis visuals a mesura que es reben més dades, com ara imatges que s'omplen gradualment o un flaix de contingut sense estil.[7]

Motors notables

modifica

Cronologia

modifica

Només es mostra la durada del desenvolupament actiu, que és quan es continuen afegint nous estàndards web rellevants al motor.

Referències

modifica
  1. 1,0 1,1 1,2 1,3 «Behind the scenes of modern web browsers». Tali Garsiel. [Consulta: 21 abril 2018].
  2. 2,0 2,1 «Gecko». Mozilla. Arxivat de l'original el 4 June 2014. [Consulta: 21 abril 2018].
  3. «Introducing Goanna». M.C. Straver, 22-06-2015. [Consulta: 21 abril 2018].
  4. 4,0 4,1 4,2 4,3 «How Blink Works». Google. [Consulta: 12 març 2024].
  5. «Open Source - Spotify». [Consulta: 1r desembre 2023].
  6. , 25-10-2016.
  7. Boudreaux, Ryan. «How to prevent Flash of Unstyled Content on your websites» (en anglès). TechRepublic, 18-10-2013. Arxivat de l'original el 2021-03-05. [Consulta: 9 octubre 2021].
  8. Paul Festa. «Apple snub stings Mozilla». CNET Networks, 14-01-2003. Arxivat de l'original el 25 October 2012. [Consulta: 16 febrer 2017].
  9. «Open-sourcing Chrome on iOS!». [Consulta: 26 abril 2021].
  10. Bright, Peter. «Google going its way, forking WebKit rendering engine». Ars Technica. Conde Nast, 03-04-2013. [Consulta: 9 març 2017].
  11. Mackie, Kurt. «Microsoft Edge Browser To Get New Rendering Engine but EdgeHTML Continues». Redmond Mag, 10-12-2018. [Consulta: 21 desembre 2019].
  12. Mendelevich, Alan. «You Think You Can Forget About the "Legacy" Microsoft Edge? Not So Fast!», 14-05-2021.