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ó

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ó

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

  • Apple va crear el motor WebKit per al seu navegador Safari bifurcant el motor KHTML del projecte KDE .[8] Tots els navegadors per a iOS han d'utilitzar WebKit com a motor.[9]
  • Google va utilitzar originalment WebKit per al seu navegador Chrome, però finalment el va bifurcar per crear el motor Blink .[10] Tots els navegadors basats en Chromium utilitzen Blink, igual que les aplicacions creades amb CEF, Electron o qualsevol altre marc que incrusti Chromium.
  • Microsoft té dos motors propietaris, Trident i EdgeHTML . Trident s'utilitza al navegador Internet Explorer . EdgeHTML va ser el motor original del navegador Edge, però es va tornar a fer amb el motor Blink.[11] EdgeHTML encara s'utilitza en algunes aplicacions UWP .[12]
  • Mozilla desenvolupa el motor Gecko per al seu navegador Firefox i el client de correu electrònic Thunderbird .[2]

Cronologia

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

Referències

  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: 1 December 2023].
  6. ↑ , 25-10-2016.
  7. ↑ Boudreaux, Ryan. «How to prevent Flash of Unstyled Content on your websites» (en anglès). TechRepublic, October 18, 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 December 2018. [Consulta: 21 December 2019].
  12. ↑ Mendelevich, Alan. «You Think You Can Forget About the "Legacy" Microsoft Edge? Not So Fast!», 14-05-2021.