W maju mogliśmy zauważyć, że parę funkcji Microsoft Edge działa szybciej i bardziej responsywnie. To wynik prac Microsoftu, które mają na celu przyspieszenie zarówno nowych, jak i podstawowych funkcji przeglądarki. Co już udało się osiągnąć, co jest w planach i jak wyglądają prace?
Począwszy od Edge 122, interfejs "Podstawowych informacji o przeglądarce" jest o 42% szybszy dla użytkowników Edge i aż o 76% szybszy dla tych, którzy mają urządzenie bez dysku SSD lub z mniej niż 8 GB pamięci RAM. Innym obszarem z turbodoładowaniem są Ulubione, których UI w Edge 124 reaguje o 40% szybciej. A to tylko wierzchołek góry lodowej. W przyszłych miesiącach twórcy przeglądarki zamierzają podnieść responsywność historii, pobranych, portfela i innych funkcji. Skąd wiadomo, co wymaga poprawy?
Monitorowanie responsywności UI
Microsoft wyjawił, że Edge monitoruje responsywność UI poprzez telemetrię zbieraną na urządzeniach użytkowników końcowych. Badania te wykazały m.in., że istnieje kilka obszarów, które absolutnie wymagają poprawy responsywności, aby użytkownicy postrzegali interfejs jako szybki. Dane zaś pokazały, że UI może być jeszcze bardziej responsywny. Udało się też poprawić responsywność na urządzeniach z mniejszą ilością zasobów. Microsoft zauważył też, że wiele używanych pakietów kodu było zbyt dużych i było tak z dwóch powodów:
- Sposób organizacji kodu UI w Edge nie był wystarczająco modularny. Zespoły pracujące nad różnymi składnikami współdzieliły te zestawy, nawet gdy nie były one koniecznie potrzebne. W efekcie jedna część kodu UI spowalniała inną część, niepotrzebnie współdzieląc rzeczy.
- Duża część kodu używała frameworka, który opierał się na JavaScript, aby renderować UI. Chodzi o renderowanie po stronie klienta, co było popularnym trendem wśród deweloperów webowych w ciągu ostatniej dekady.
Renderowanie UI tak, jak powinno się to robić
Od wielu lat wiele stron renderuje się po stronie klienta. Wymaga to pobrania JavaScript i uruchomienia go poprzez kompilator JIT (nawet gdy użytkownik go nie używa), a następnie wykonania, a wszystko to musi być zrobione, zanim JavaScript zacznie renderować UI. Powoduje to wiele opóźnień, zanim użytkownik zobaczy interfejs, zwłaszcza na słabszych urządzeniach.
W erze poprzedzającej Web 2.0 zawartość webowa była renderowana z użyciem HTML i CSS. Zwykle odnosi się to do renderowania po stronie serwera, podczas gdy klient otrzymywał zawartość w formie gotowej do wyrenderowania. Nowoczesne silniki przeglądarek są bardzo szybkie w renderowaniu tej zawartości, dopóki na drodze nie stanie JavaScript. Mając to na uwadze, Microsoft postawił pytania:
- Czy możemy zachować produktywność deweloperów, zapewnianą przez frameworki JavaScript, generując kod, który szybko renderuje UI?
- Czy przeglądarka może być swoim najlepszym klientem?
- Jak szybko moglibyśmy tworzyć rzeczy, gdybyśmy usunęli ten framework i zbudowali nasz UI, używając tylko platformy internetowej?
Odpowiedzi na te pytania brzmią: Tak, Tak, Bardzo szybko.
Wprowadzenie WebUI 2.0
Mając to wszystko na uwadze, Microsoft wystartował z wewnętrznym projektem Edge o nazwie WebUI 2.0. W jego ramach zbudowano architekturę, która minimalizuje rozmiar pakietów kodu oraz ilość kodu JavaScript, który uruchamia się podczas ścieżki inicjalizacji UI. Ta nowa architektura UI jest bardziej modułowa i opiera się teraz na repozytorium składników webowych, które są zoptymalizowane do osiągania wysokiej wydajności na nowoczesnych silnikach webowych.
Pierwszą funkcją przekonwertowaną do tej architektury są wspomniane już "Podstawowe informacje o przeglądarce" ("Browser Essentials"). Udowodniono działanie tego konceptu, szczególnie na wszystkich typach urządzeń. Obecnie trwają prace nad upgradem komponentów interfejsu użytkownika Edge do WebUI 2.0, więc z biegiem czasu możemy spodziewać się dalszych ulepszeń.
Twórcy przeglądarki mają nadzieję, że więcej witryn zacznie kierować się w stronę "markup-first", małych pakietów i mniejszej ilości kodu JavaScript renderującego UI. Z czasem planują oni przejście z niektórymi pakietami na Open Source, co powinno przynieść korzyści deweloperom. Wreszcie, dalej ulepszając WebUI 2.0, Microsoft szuka możliwości jeszcze większego poprawienia samej platformy webowej.
Źródło: https://blogs.windows.com/msedgedev/2024/05/28/an-even-faster-microsoft-edge/
