Procesor, GPU, pamięć i architektura wieloprocesowa
W tej 4-częściowej serii postów na blogu przyjrzymy się wnętrzu przeglądarki Chrome, od architektury wysokiego poziomu po na temat specyfiki potoku renderowania. Jeśli zastanawiasz się, w jaki sposób przeglądarka przekształca kod w kod witryna funkcjonuje lub nie masz pewności, dlaczego zalecana jest konkretna technika jak je ulepszać, ta seria jest dla Ciebie.
W pierwszej części przyjrzymy się podstawowej terminologii obliczeniowej oraz architekturę wieloprocesową.
CPU i GPU są podstawą komputera
Aby zrozumieć środowisko, w którym działa przeglądarka, musimy poznać o częściach komputerowych i ich działaniu.
CPU
![CPU](https://developer.chrome.com/static/blog/inside-browser-part1/image/cpu-fc96f4ee3715f.png?authuser=19&hl=pl)
Pierwszy to centryczny proces. Procesor może być uznawany za w mózgu komputera. Rdzeń procesora, przedstawiony tutaj jako pracownik biurowy, może wykonywać wiele różnych zadań jeden po drugim. Potrafi poradzić sobie z wszystkimi zadaniami – od matematyki po sztukę, nie rezygnując z odpowiednich odpowiedzi do rozmowy z klientem. W przeszłości większość procesorów odpowiadała jednemu układowi. Rdzeń jest jak inny procesor żywy ten sam element. Nowoczesny sprzęt często obejmuje więcej niż 1 rdzeń, co zapewnia większą moc obliczeniową. bezpośrednio na telefony i laptopy.
GPU
![GPU](https://developer.chrome.com/static/blog/inside-browser-part1/image/gpu-ff4b6081ab9b1.png?authuser=19&hl=pl)
Przetwarzanie technologii Unit – czyli GPU to inna część komputera. W przeciwieństwie do procesora GPU świetnie radzi sobie z prostymi zadaniami, ale używa też wielu rdzeni jednocześnie. Jako nazwa co stwierdza, że została ona najpierw opracowana do obsługi grafiki. Dlatego w kontekście grafiki „używam GPU” lub „z procesorami GPU” wiąże się z szybkim renderowaniem i płynną interakcją. W ciągu ostatnich lat, dzięki zastosowaniu obliczeniowych akceleracji za pomocą procesora GPU, coraz więcej możliwości obliczeniowych samego GPU.
Gdy uruchamiasz aplikację na komputerze lub telefonie, zasilają Cię procesory (GPU) i układy graficzne aplikacji. Zwykle aplikacje działają na CPU i GPU, korzystając z mechanizmów udostępnianych przez System operacyjny.
![Sprzęt, system operacyjny, aplikacja](https://developer.chrome.com/static/blog/inside-browser-part1/image/hardware-os-application-d4c78524d5558.png?authuser=19&hl=pl)
Realizacja programu dla procesu i wątku
![procesy i wątki](https://developer.chrome.com/static/blog/inside-browser-part1/image/process-threads-6fe2ce3d7b3e2.png?authuser=19&hl=pl)
Kolejną koncepcją, którą warto opanować przed zagłębieniem się w architekturę przeglądarki, są procesy i wątki. Proces można opisać jako program wykonujący aplikację. Wątek to ten, który żyje w środku procesu i wykonuje dowolną część jego programu.
Uruchomienie aplikacji powoduje utworzenie procesu. Program może utworzyć wątki, aby w tym pomóc. jak można to zrobić, ale jest to opcjonalne. System operacyjny nadaje procesowi nazwę „płytki”. pamięci do pracy i cały stan aplikacji są przechowywane w tym miejscu pamięci prywatnej. Po zamknięciu aplikacji, proces także przestaje działać, a system operacyjny zwalnia pamięć.
Proces może poprosić system operacyjny o uruchomienie innego procesu w celu uruchomienia innych zadań. Gdy to różne części pamięci są przydzielane nowemu procesowi. Jeśli 2 procesy muszą używają do tego komunikacji komunikacyjnej (IPC). Wiele aplikacji są zaprojektowane tak, aby działały w ten sposób. Jeśli proces roboczy nie odpowiada, można go uruchomić ponownie; bez zatrzymywania innych procesów, które uruchamiają różne części aplikacji.
Architektura przeglądarki
Jak zbudowana jest przeglądarka, korzystając z procesów i wątków? Może to być jeden proces w różnych wątkach lub na wielu różnych procesach przez kilka wątków komunikujących się przez IPC.
![architektura przeglądarki](https://developer.chrome.com/static/blog/inside-browser-part1/image/browser-architecture-9d143004c2a63.png?authuser=19&hl=pl)
Należy pamiętać, że te różne architektury stanowią szczegóły implementacji. Nie istnieje żadna standardowa specyfikacja sposobu tworzenia przeglądarki. Jedna z przeglądarek może całkowicie różnić się od innych.
W ramach tej serii postów używamy najnowszej architektury Chrome, opisane na Rys. 8.
U góry znajduje się proces przeglądarki koordynowany z innymi procesami, które zajmują się różnymi z różnych części aplikacji. W ramach procesu renderowania jest tworzonych wiele procesów, które są przypisywane do każdej karty. Do niedawna Chrome oceniał każdą kartę w miarę możliwości. teraz próbuje dać każda witryna ma własny proces, w tym elementy iframe (patrz Izolacja witryn).
![architektura przeglądarki](https://developer.chrome.com/static/blog/inside-browser-part1/image/browser-architecture-998609758999a.png?authuser=19&hl=pl)
Który proces o co chodzi?
W tabeli poniżej opisujemy poszczególne procesy Chrome i elementy, które sterują:
Proces i kontrola nad nim | |
---|---|
Przeglądarka |
Kontroluje Chrome tej części aplikacji, w tym na pasku adresu, zakładkach,
za pomocą przycisków Dalej. Obsługuje też niewidoczne, uprzywilejowane części przeglądarki, takie jak żądań sieciowych i dostępu do plików. |
Mechanizm renderowania | Kontroluje wszystkie elementy na karcie, w których wyświetla się witryna. |
Wtyczka | Steruje wszystkimi wtyczkami używanymi przez stronę (np. Flash). |
GPU | Obsługuje zadania GPU niezależnie od innych procesów. Jest podzielony na różne procesy bo GPU obsługuje żądania z wielu aplikacji i rysuje je na tej samej powierzchni. |
![Procesy Chrome](https://developer.chrome.com/static/blog/inside-browser-part1/image/chrome-processes-79aaecca78d23.png?authuser=19&hl=pl)
Jest jeszcze więcej procesów, takich jak proces rozszerzenia i proces narzędzi. Jeśli chcesz zobaczyć ile procesów jest uruchomionych w Chrome, kliknij ikonę menu opcji.
w prawym górnym rogu, kliknij Więcej narzędzi, a potem Wybierz Menedżera zadań. Otworzy się okno z listą uruchomionych obecnie procesów i liczbę CPU/pamięć.Zaletą architektury wieloprocesowej w Chrome
Powiedziałem, że Chrome korzysta z wielu procesów renderowania. W najprostszym przypadku możesz Wyobraź sobie, że każda karta ma własny proces renderowania. Załóżmy, że masz otwarte 3 karty, a każda z nich jest uruchomiona. w ramach niezależnego procesu renderowania.
Jeśli któraś z kart przestanie odpowiadać, możesz ją zamknąć i kontynuować, nie tracąc inne karty. Jeśli wszystkie karty są uruchomione w jednym procesie, a jedna z nich przestanie odpowiadać, wszystkie karty nie odpowiadają. To smutne.
![mechanizm renderowania kart](https://developer.chrome.com/static/blog/inside-browser-part1/image/multiple-renderer-tabs-c29a1fd34d4d.png?authuser=19&hl=pl)
Kolejną zaletą podzielenia pracy przeglądarki na kilka procesów jest w piaskownicy. Systemy operacyjne dają możliwość ograniczenia procesów uprawnienia przeglądarki mogą oddzielić pewne procesy od określonych funkcji. Przeglądarka Chrome ogranicza na przykład: dowolnego dostępu do plików na potrzeby procesów, które obsługują dowolne dane wejściowe użytkownika, np. mechanizm renderowania.
Procesy mają własny obszar pamięci prywatnej, więc często zawierają kopie wspólnych (np. V8, który jest mechanizmem JavaScriptu w Chrome). Oznacza to większe wykorzystanie pamięci jako nie można ich udostępniać w taki sam sposób, jakby byłyby wątkami w ramach tego samego procesu. Aby oszczędzać pamięć, Chrome ogranicza liczbę procesów, które może uruchomić. Limit różni się w zależności od ilości pamięci i mocy procesora urządzenia, ale po uruchomieniu Chrome powoduje uruchomienie wielu kart z tej samej witryny podczas jednego procesu.
Oszczędzanie pamięci – obsługa w Chrome
Takie samo podejście dotyczy procesu przeglądarki. Architektura Chrome zmienia się Uruchamianie każdej części programu przeglądarki jako usługi, co pozwala podzielić ją na różne procesy lub łączyć w jeden.
Ogólnie rzecz biorąc, jeśli Chrome działa na zaawansowanym sprzęcie, usługi mogą być podzielone na są bardziej stabilne, ale jeśli działa na urządzeniu z ograniczeniem zasobów, konsoliduje usługi w jednym procesie, oszczędzając ilość pamięci. Podobne podejście do konsolidacji przed wprowadzeniem tej zmiany na platformach takich jak Android – procesy mniejsze z wykorzystaniem pamięci.
Procesy renderowania z podziałem na klatki – izolacja witryn
Sekcja Izolacja witryn została ostatnio wprowadzona w Chrome funkcja, która uruchamia oddzielny proces renderowania dla każdego elementu iframe z innej witryny. Mówiliśmy o jednym procesie renderowania na model karty, który umożliwiał Elementy iframe uruchamiane w ramach jednego procesu renderowania z wspólną przestrzenią pamięci między różnymi witrynami. Uruchomienie domen a.com i b.com w tym samym procesie renderowania może wydawać się dozwolone. Zasady dotyczące tego samego pochodzenia to podstawowy model bezpieczeństwa sieci; Zapewnia to, że jedna witryna nie ma dostępu do danych z innych witryn. bez zgody. Omijanie tej zasady jest głównym celem ataków bezpieczeństwa. Izolacja procesów to najskuteczniejszy sposób rozdzielania witryn. Na Meltdown i Spectre, stało się jeszcze bardziej oczywiste, że trzeba oddzielić witryny za pomocą procesów. Po włączeniu izolacji witryn domyślnie na komputerach od Chrome 67 każdy element iframe z innej witryny na karcie otrzyma osobny proces renderowania.
![izolacja witryn](https://developer.chrome.com/static/blog/inside-browser-part1/image/site-isolation-2521dc96bb823.png?authuser=19&hl=pl)
Włączenie izolacji witryn było wieloletnim pracą naszych inżynierów. Izolacja witryn nie jest tak prosta, przypisywanie różnych procesów renderowania; to zasadniczo zmienia sposób, w jaki elementy iframe komunikują się inne. Otwieranie narzędzi deweloperskich na stronie z elementami iframe uruchomionymi w różnych procesach oznaczało, że narzędzia deweloperskie musiały i zaimplementować rozwiązania zakulisowe, aby wszystko wyglądało płynnie. nawet użycie prostego skrótu Ctrl+F w celu „Słowo kluczowe na stronie” oznacza wyszukiwanie w różnych procesach renderowania. Możesz zobaczyć, dlaczego Inżynierowie przeglądarek mówią o wprowadzeniu funkcji izolacji witryn jako przełomowego kamienia milowego.
Podsumowanie
W tym poście omówiliśmy ogólny przegląd architektury przeglądarki i zalety architekturę wieloprocesową. Omówiliśmy też udostępnianie i izolację witryn w Chrome, lub ściśle związana z architekturą wieloprocesową. W następnym poście zajmiemy się tym, odbywa się między tymi procesami i wątkami, aby wyświetlić stronę internetową.
Podobał Ci się post? Jeśli masz pytania lub sugestie dotyczące przyszłych postów, chętnie na nie odpowiem skontaktuj się z nami, pisząc na @kosamari na Twitterze.