CPU, GPU, memoria e architettura multiprocesso
In questa serie di blog in 4 parti, esamineremo l'interno del browser Chrome, dall'architettura di alto livello a e le specifiche della pipeline di rendering. Se ti sei mai chiesto in che modo il browser trasforma il tuo codice un sito web funzionante o non sei sicuro del motivo per cui viene suggerita una tecnica specifica per il rendimento miglioramenti, questa serie fa al caso tuo.
Nella prima parte di questa serie, daremo un'occhiata alla terminologia informatica di base e un'architettura multiprocesso.
Alla base del computer ci sono CPU e GPU
Per comprendere l'ambiente in cui è in esecuzione il browser, abbiamo bisogno di alcune le parti del computer e la loro funzione.
CPU
La prima è la Centrale Unit di processo, o CPU. La CPU può essere considerata il cervello di un computer. Un core della CPU, qui raffigurato come un impiegata, è in grado di gestire molte attività diverse una per una man mano che arrivano. È in grado di gestire qualsiasi cosa, dalla matematica all'arte, pur sapendo come rispondere. alla chiamata del cliente. In passato, la maggior parte delle CPU erano un singolo chip. Un core è come un'altra CPU che vive lo stesso chip. Nell'hardware moderno spesso si dispone di più di un core, il che fornisce una maggiore potenza di calcolo a telefoni e laptop.
GPU
L'unit o Grafica Grafitica è un'altra parte del computer. A differenza della CPU, La GPU è adatta a gestire attività semplici, ma su più core contemporaneamente. Come nome suggerisce che sia stato sviluppato inizialmente per gestire la grafica. È per questo che, nell'ambito della grafica, "utilizzo GPU" o "supportato da GPU" è associato a un rendering veloce e a un'interazione fluida. Negli ultimi anni, con il computing con accelerazione GPU, è diventato possibile fare sempre più calcoli su la sola GPU.
Quando avvii un'applicazione sul tuo computer o smartphone, CPU e GPU sono quelle che alimentano per l'applicazione. Di solito, le applicazioni vengono eseguite su CPU e GPU utilizzando i meccanismi forniti Sistema operativo.
Esegui programma su processo e Thread
Un altro concetto da comprendere prima di approfondire l'architettura del browser è Process e Thread. Un processo può essere descritto come il programma di esecuzione di un'applicazione. Il thread è quello che vive all'interno del processo ed esegue qualsiasi parte del relativo programma.
Quando avvii un'applicazione, viene creato un processo. Il programma potrebbe creare thread per agevolare funzionano, ma questo è facoltativo. Il sistema operativo fornisce al processo uno "slab" di memoria per lavorare con e tutto lo stato dell'applicazione viene mantenuto nello spazio di memoria privato. Quando chiudi il un'applicazione, anche il processo scompare e il sistema operativo libera memoria.
Un processo può chiedere al sistema operativo di avviare un altro processo per eseguire attività diverse. Quando questo al nuovo processo vengono allocate diverse parti della memoria. Se due processi devono conversazione, puoi utilizzare la Comunicazione di intere procedimento (IPC). Molte applicazioni sono progettate per funzionare in questo modo, in modo che, se un processo worker non risponde, possa essere riavviato. senza arrestare altri processi che eseguono parti diverse dell'applicazione.
Architettura del browser
Dunque, come si crea un browser web utilizzando processi e thread? Potrebbe trattarsi di un processo con thread diversi o processi diversi con alcuni thread che comunicano tramite IPC.
La cosa importante da notare qui è che queste diverse architetture sono dettagli di implementazione. Non esiste una specifica standard per la creazione di un browser web. L'approccio di un browser può completamente diversa da un'altra.
Nell'ambito di questa serie di blog, utilizziamo la recente architettura di Chrome, descritti nella Figura 8.
In alto c'è il processo del browser che si coordina con altri processi che si occupano di diversi dell'applicazione. Per il processo del renderer, vengono creati più processi e assegnati ogni scheda. Fino a poco tempo fa, Chrome offriva a ogni scheda un processo quando poteva; prova a dare per ogni sito la propria procedura, inclusi gli iframe (consulta Isolamento dei siti).
Quale processo controlla cosa?
Nella tabella seguente sono descritti tutti i processi di Chrome e i relativi controlli:
| Processo e cosa controlla | |
|---|---|
| Browser |
Controlla "chrome" parte dell'applicazione, tra cui barra degli indirizzi, preferiti, Indietro e
pulsanti Avanti. Gestisce anche le parti invisibili e privilegiate di un browser web come richieste di rete e accesso ai file. |
| Renderer | Controlla qualsiasi elemento all'interno della scheda in cui è visualizzato un sito web. |
| Plug-in | Controlla tutti i plug-in utilizzati dal sito web, ad esempio Flash. |
| GPU | Gestisce le attività GPU separatamente da altri processi. È separato in un processo diverso perché le GPU gestiscono le richieste da più app e le disegna nella stessa piattaforma. |
Esistono anche altri processi, come il processo di estensione e quelli di utilità. Se vuoi visualizzare quanti processi sono in esecuzione su Chrome, fai clic sull'icona del menu Opzioni nell'angolo in alto a destra, seleziona Altri strumenti e poi seleziona Task Manager. Si apre una finestra con un elenco dei processi attualmente in esecuzione e la quantità di CPU/memoria utilizzata.
Il vantaggio dell'architettura multiprocesso in Chrome
In precedenza ho detto che Chrome utilizza più processi di renderer. Nel caso più semplice, puoi immagina che ogni scheda abbia il proprio processo di rendering. Supponiamo che tu abbia tre schede aperte e che ogni scheda sia in esecuzione da un processo di rendering indipendente.
Se una scheda non risponde, puoi chiuderla e andare avanti mantenendo la scheda. le altre schede attive. Se tutte le schede sono in esecuzione in un solo processo e una scheda non risponde, le schede non rispondono. È triste.
Un altro vantaggio di separare il lavoro del browser in più processi è la sicurezza e la limitazione tramite sandbox. Poiché i sistemi operativi consentono di limitare i processi i privilegi, il browser possono limitare alcuni processi di determinate funzionalità. Ad esempio, il browser Chrome limita accesso arbitrario al file per i processi che gestiscono un input arbitrario dell'utente come il processo del renderer.
Poiché i processi hanno un proprio spazio di memoria privato, spesso contengono copie delle infrastruttura (come V8, che è un motore JavaScript di Chrome). Ciò significa più memoria utilizzata non possono essere condivisi come lo sarebbero se fossero thread all'interno dello stesso processo. Per risparmiare memoria, Chrome pone un limite al numero di processi che può avviare. Il limite varia a seconda della quantità di memoria e di potenza della CPU del dispositivo, ma quando Chrome raggiunge il numero al limite, vengono eseguite più schede dello stesso sito in un unico processo.
Risparmio di più memoria - Servicificazione in Chrome
Lo stesso approccio viene applicato al processo del browser. Sono in corso modifiche all'architettura di Chrome eseguire ogni parte del programma del browser come servizio, consentendo la suddivisione in processi diversi o aggregarli in uno solo.
L'idea generale è che quando Chrome è in esecuzione su un hardware potente, può suddividere ogni servizio in a processi diversi che offrono maggiore stabilità, ma se si trova su un dispositivo con vincoli di risorse, consolida i servizi in un unico processo, risparmiando spazio di memoria. Approccio simile al consolidamento per ridurre l'utilizzo della memoria sono stati utilizzati su piattaforme come Android prima di questo cambiamento.
Processi del renderer per frame - Isolamento dei siti
L'isolamento dei siti è un evento recente è stata introdotta in Chrome una funzionalità che esegue un processo di rendering separato per ogni iframe tra siti. Abbiamo parlato di un processo del renderer per modello di scheda che consentiva di eseguire query iframe da eseguire in un singolo processo di rendering con spazio di memoria condiviso tra siti diversi. È possibile eseguire a.com e b.com nello stesso processo del renderer. Le norme relative alla stessa origine è il modello di sicurezza fondamentale del web; assicura che un sito non possa accedere ai dati di altri siti senza consenso. L'aggiramento di questo criterio è un obiettivo primario degli attacchi alla sicurezza. L'isolamento dei processi è il modo più efficace per separare i siti. Con Meltdown e Spectre, è diventato ancora più evidente che dobbiamo separare i siti utilizzando i processi. Con l'isolamento dei siti attivato per impostazione predefinita sul computer a partire da Chrome 67, ogni iframe tra siti in una scheda ottiene un processo del renderer separato.
L'abilitazione dell'isolamento dei siti è stata uno sforzo ingegneristico pluriennale. L'isolamento dei siti non è semplice come assegnare processi del renderer diversi; cambia sostanzialmente il modo in cui gli iframe comunicano e l'altro. Aprire devtools su una pagina con iframe in esecuzione su processi diversi significava che devtools doveva a implementare il dietro le quinte per assicurare un'esperienza fluida. Anche eseguendo un semplice Ctrl+F per trovare in una pagina significa cercare tra diversi processi del renderer. Puoi vedere il motivo i tecnici dei browser parlano del rilascio dell'isolamento dei siti come una pietra miliare.
Conclusione
In questo post, abbiamo parlato di una visione generale dell'architettura del browser e dei vantaggi di una un'architettura multiprocesso. Abbiamo esaminato anche la manutenzione e l'isolamento dei siti in Chrome, è profondamente legata all'architettura multiprocesso. Nel prossimo post inizieremo tra questi processi e thread per visualizzare un sito web.
Ti è piaciuto il post? Se hai domande o suggerimenti per il prossimo post, mi piacerebbe ascolta la tua opinione su @kosamari su Twitter.
Passaggio successivo: Che cosa succede durante la navigazione