Porównanie prędkości: odkrywanie niesamowicie szybkiego kreatora wizualnego Divi 5

Opublikowany: 2024-09-30

Jako projektanci i programiści stron internetowych wiemy, że wydajność jest najważniejsza. Oczekiwanie, aż powolny kreator stron załaduje lub wyrenderuje zmiany, może przerwać przepływ pracy twórczej i obniżyć produktywność. Dlatego jednym z głównych celów Divi 5 jest zrewolucjonizowanie szybkości i wydajności Visual Buildera. Zagłębiliśmy się głęboko w podstawową strukturę Divi i przebudowaliśmy ją od podstaw, aby stworzyć niesamowicie szybki i bardziej responsywny kreator.

W tym poście omówię ulepszenia wydajności w programie Visual Builder, dzięki którym Divi 5 jest szybszy niż jakakolwiek poprzednia wersja. Wszystko w Divi 5 Visual Builder zostało zoptymalizowane pod kątem szybkości.

Przyjrzyjmy się teraz, jak wpłynie to na przepływ pracy przy projektowaniu stron internetowych i dlaczego już nigdy nie będziesz chciał wracać do wolniejszych narzędzi do tworzenia stron.

Spis treści
  • 1 Przepisywanie wszystkiego: co wyróżnia Divi 5?
    • 1.1 1. Ulepszone prędkości ponownego renderowania narzędzia Visual Builder
    • 1.2 2. Szybsze czasy ładowania (czytaj: Koniec z podwójnymi przeładowaniami)
    • 1.3 3. Usunęliśmy wszystkie animacje interfejsu
    • 1.4 Dokąd zmierza Divi 5?
    • 1.5 Przyszłość Divi jest szybka

Przepisywanie wszystkiego: co wyróżnia Divi 5?

Divi 5 to znacznie więcej niż aktualizacja przyrostowa. Jest to całkowite przepisanie podstawowych technologii Divi, zaprojektowane na nowo z naciskiem na wydajność, stabilność i skalowalność. Ta fundamentalna zmiana zmusiła nas do ponownego przemyślenia, w jaki sposób Visual Builder działa u podstaw, czyniąc go znacznie szybszym i potężniejszym.

Chociaż Divi 4 był już potężnym narzędziem na milionach stron internetowych, jego architektura miała ponad dekadę. Udoskonalaliśmy go i przesuwaliśmy granice, ale w końcu przyszedł czas na zbudowanie nowego fundamentu.

Dług techniczny doprowadził do wolniejszego ładowania, opóźnień w ponownym renderowaniu i sporadycznej niestabilności, szczególnie podczas pracy ze złożonymi układami. Aby rozwiązać ten problem, zespół Divi 5 przebudował całą platformę od nowa, optymalizując ją pod kątem wydajności i przyszłej skalowalności. Wyniki mówią same za siebie: wszystko w Divi 5 dzieje się szybciej, od ładowania kreatora po wprowadzanie zmian i podgląd zmian.

Pobierz Divi 5 Alpha Wypróbuj Divi 5 Demo Zgłoś błąd Divi 5

1. Ulepszone prędkości ponownego renderowania narzędzia Visual Builder

Kiedy pracujesz z narzędziem przez cały dzień, szybkość ma znaczenie. Nawet najmniejsze związki opóźniające z biegiem czasu. W poprzednich wersjach Divi projektanci musieli czasami czekać ułamek sekundy na reakcję Visual Buildera podczas dodawania nowych elementów lub dostosowywania stylów. Było to szczególnie zauważalne podczas pracy z długimi dokumentami (z dziesiątkami sekcji wypełnionymi modułami i niestandardową stylizacją).

Zwróć uwagę na migotanie stylu na D4 (po lewej), gdzie pełne zastosowanie stylów ze zduplikowanej sekcji trwa milisekundy. Jest to na dodatek wolniejsze niż D5 (po prawej), aby zduplikować sekcję.

Dzięki Divi 5 prędkość ponownego renderowania została radykalnie poprawiona, co pozwala na pracę bez opóźnień. Visual Builder reaguje natychmiast po dodaniu nowego modułu, przełączeniu trybów widoku lub dostosowaniu stylów. Ten poziom responsywności robi ogromną różnicę, szczególnie podczas pracy nad złożonymi projektami, które wymagają wielu dostrojeń.

Ale co dokładnie się zmieniło, że konstruktor stał się o wiele szybszy?

Technologia umożliwiająca szybsze ponowne renderowanie

Jedynym sposobem na osiągnięcie takiego poziomu poprawy było rozpoczęcie od zera. Wzięliśmy wszystko, czego nauczyliśmy się przez ostatnią dekadę rozwoju Divi i stworzyliśmy nową aplikację wykorzystującą nowoczesną technologię, eliminując lata długu technicznego. Spędziliśmy czas na audytowaniu różnych interakcji i identyfikowaniu wąskich gardeł. Nadal to robimy, a Divi 5 z każdą aktualizacją staje się coraz szybszy.

Odejście od krótkich kodów pomogło również w usprawnieniu przeglądania złożonych projektów. W jutrzejszym poście omówimy, dlaczego framework shortcode musiał zostać usunięty i jak radzi sobie Divi 5.

Czy potrafisz dostrzec różnicę w poniższym filmie porównawczym? Podkreśla kolejną dużą poprawę w Divi 5: lepszą wydajność podczas edycji ustawień wstępnych! W Divi 5 ustawienia wstępne są oparte na klasach. Ponieważ wszystkie gotowe elementy mają tę samą klasę, w kreatorze potrzeba mniej ponownych renderowań, a na interfejsie potrzeba mniej CSS.

2. Krótsze czasy ładowania (czytaj: Koniec z podwójnymi przeładowaniami)

Istotnym problemem w starszych wersjach Divi było podwójne przeładowanie podczas uruchamiania Visual Buildera, występujące, gdy moduły i wtyczki innych firm omyłkowo wstrzykiwały dynamiczne dane do pamięci podręcznej Visual Buildera. Ten błąd był tak powszechny, że podwójne przeładowanie stało się częstym problemem.

Divi 5 „naprawia” ten problem, ponieważ jest tak szybki od razu po wyjęciu z pudełka, że ​​nie wymaga buforowania! Ponieważ niczego nie buforujemy, nie ma możliwości, aby pamięć podręczna została unieważniona i nigdy więcej nie doświadczysz podwójnego przeładowania.

Czasy ładowania zostały ogólnie poprawione. Sprawdź, jak szybko ładuje się Divi 5 w porównaniu do Divi 4. W moim teście ładowało się tak szybko, że nawet nie miałeś szansy zobaczyć naszej nowej, fantazyjnej animacji wstępnego ładowania.

To usprawnienie jest szczególnie zauważalne dla projektantów pracujących nad większymi projektami. Poprzednio pełne załadowanie dużego projektu w programie Visual Builder mogło zająć kilka sekund.

3. Usunęliśmy wszystkie animacje interfejsu

Jedną z najbardziej zauważalnych zmian w nowym interfejsie Divi 5 (poza jego nowoczesnym przeprojektowaniem) jest usunięcie wszystkich animacji.

W poprzednich wersjach animacje zapewniały wizualne informacje zwrotne podczas interakcji z konstruktorem (np. dodawania nowych modułów lub przełączania trybów widoku). Chociaż te animacje dodały pewnego poziomu zabawy, wprowadziły także niewielkie opóźnienia w procesie projektowania, szczególnie na wolniejszych systemach.

Filozofia projektowania Divi 5 jest inna. Interfejs ma Ci służyć, nic więcej. To minimalne. To nie staje ci na drodze. Nie konkuruje z Twoim projektem. Nie dba o to, żeby wyglądać fajnie. Jego interfejs użytkownika/UX opiera się na szybkości i wydajności.

Czy zauważasz te wszystkie subtelne animacje (zanikanie, wsuwanie i podobne), których używa Divi 4? Niepotrzebnie powodują one, że interfejs użytkownika wydaje się wolniejszy i mniej responsywny. W Divi 5 przyjęliśmy podejście polegające na przekroczeniu prędkości. Usunęliśmy te animacje, aby przyspieszyć kreator i uczynić go bardziej responsywnym. Skupiono się teraz wyłącznie na funkcjonalności, zapewniając, że każda akcja, którą podejmiesz w kreatorze, nastąpi tak szybko, jak to możliwe.

Dokąd zmierza Divi 5?

Publiczna alfa została oficjalnie uruchomiona. Po pierwsze, chcielibyśmy podziękować za cierpliwość, podczas której pilnie pracowaliśmy przez ostatnie miesiące, aby udostępnić publiczną wersję alfa Divi 5. Nie było to małe zadanie, a nasza praca dopiero się zaczyna.

Divi 5 Alfa

Jak Nick wspomniał w czwartek, spędzimy około miesiąca na naprawianiu znanych błędów z naszych zaległości oraz wielu błędów, które wy, społeczność, znajdujecie właśnie teraz. Publiczna wersja alfa Divi 5 jest w dużej mierze wersją alfa, ale niestrudzenie pracujemy nad doprowadzeniem jej do stanu gotowości do produkcji. Możesz pomóc, uruchamiając Divi 5 na swoich lokalnych i testowych stronach, znajdując wszystkie możliwe błędy i zgłaszając je naszemu zespołowi wsparcia. Przeanalizujemy każdy znaleziony błąd i w miarę pojawiania się będziemy pracować nad najpilniejszymi.

Pobierz raport Divi 5 Alpha dotyczący błędu Divi 5

Jeśli nie masz platformy testowej ani witryny lokalnej, na której możesz przetestować, nadal możesz zmoczyć stopy w wersji demonstracyjnej Divi 5. Jest to świetny sposób na przyzwyczajenie się do przeprojektowania i układu nowego kreatora. To spora zmiana, ale bardzo potrzebna.

Wypróbuj wersję demonstracyjną Divi 5

Przyszłość Divi jest szybka

Divi 5 stanowi znaczący krok naprzód pod względem szybkości i wydajności. Divi jest teraz potężniejszy i responsywny dzięki niesamowicie szybkiemu ponownemu renderowaniu, krótszemu czasowi ładowania i przeprojektowanemu kreatorowi, który przedkłada użyteczność nad styl. Niezależnie od tego, czy jesteś samodzielnym projektantem stron internetowych, czy częścią większego zespołu programistów, te ulepszenia sprawią, że Twoja praca będzie szybsza, płynniejsza i wydajniejsza.

Jeśli korzystałeś z Divi 4, będziesz zdumiony szybkością działania Divi 5. Najlepsza część? To dopiero początek. W miarę optymalizacji i rozbudowy środowiska Divi 5 kreator będzie coraz szybszy i potężniejszy. Przyszłość projektowania stron internetowych z Divi płonie szybko — a my dopiero zaczynamy.

W nadchodzących dniach porozmawiamy o tym, co to znaczy, że Divi 5 odchodzi od krótkich kodów, zagłębiając się w system migracji witryn i perspektywę programisty. Nie zapomnij obserwować i subskrybować, aby otrzymywać te aktualizacje i nie tylko.