Jak Elementor ustala priorytety i poprawia wydajność stron internetowych?

Porozmawiajmy o Planie działania produktu Elementor na rok 2021, a konkretnie o optymalizacji wydajności. Chociaż nadal planujemy i rozwijamy nowe, fajne funkcje, o które prosi nasza społeczność, w tym roku postawiliśmy sobie za misję poprawę wydajności witryn internetowych naszych użytkowników. W tym poście chciałbym podzielić się z Wami niektórymi działaniami, które już podjęliśmy, aby osiągnąć ten cel i porozmawiać trochę o tym, co nadchodzi w nadchodzącym roku.

Wydajność stron internetowych była problemem dla twórców stron internetowych od zarania internetu. Będąc twórcą stron internetowych, zawsze zadawałem pytania takie jak:

• „Czy moja witryna jest zbyt wolna? Czy powoduje to, że użytkownicy opuszczają moje rankingi Google, czy też szkodzi?”
• „Czy powinienem zrezygnować z określonej funkcji, aby poprawić szybkość witryny?”
• I oczywiście: „Co, u licha, nadal powoduje moje problemy z wydajnością? Myślałem, że objąłem wszystkie bazy tutaj!”

Więc tak, uzyskanie doskonałej wydajności strony internetowej zawsze było wyzwaniem dla twórców stron internetowych, niezależnie od platformy lub narzędzi, z których korzystaliśmy. Przy tak wielu istotnych czynnikach wpływających na wydajność nie zawsze jest łatwo wyizolować prawdziwy problem, nie mówiąc już o znalezieniu rozwiązania. Właśnie dlatego stworzyliśmy ten pięcioczęściowy kurs wideo na temat wydajności . W tej serii zagłębimy się w każdy ważny czynnik, który może mieć wpływ na wydajność Twojej witryny, niezależnie od tego, czy jest ona związana z Elementorem, czy nie, i przeprowadzimy Cię przez proces jej optymalizacji.

Aby było naprawdę ciekawie, Google ogłosił niedawno, że wydajność strony internetowej będzie teraz oficjalnie odgrywać rolę w jego algorytmie rankingowym. To stawia kwestię wydajności w centrum uwagi, budząc obawy właścicieli witryn na całym świecie. Dlatego w ciągu ostatnich sześciu miesięcy nasze zespoły ds. Badań i rozwoju oraz SEO pracowały niestrudzenie, aby upewnić się, że witryny Elementor przejdą tę aktualizację i przejdą z powodzeniem.

Jeśli chodzi o tajemniczy algorytm Google, wiemy, że potrzeba więcej niż nasze słowo, abyś poczuł się bezpiecznie. Dlatego w ramach usługi dla naszych użytkowników i społeczności twórców stron internetowych zorganizujemy bezpłatne seminarium internetowe poświęcone wydajności sieci z czołowymi ekspertami SEO, aby omówić nadchodzącą zmianę. Obejmuje to nie tylko samą aktualizację, ale także szczegółowo opisuje, w jaki sposób ta zmiana może wpłynąć na Twoją witrynę i co możesz zrobić, aby się przygotować. Webinarium odbędzie się 28 kwietnia, więc nie zapomnij zarezerwować miejsca .

Jednak pomijając wszystkie kursy i seminaria internetowe, naszym głównym celem jest upewnienie się, że nasz produkt nie wpływa negatywnie na wydajność Twojej witryny. To było i będzie dla nas najwyższym priorytetem. Więc bez zbędnych ceregieli przyjrzyjmy się wysiłkom optymalizacji wydajności Elementora, zgodnie z naszą mapą drogową produktu 2021.

Poza optymalizacją naszego cyklu rozwoju produktu, nasza wizja poprawy wydajności Elementora obejmuje podejście pięciościeżkowe. W niektórych z tych obszarów wprowadziliśmy już kilka znaczących ulepszeń, podczas gdy inne zostaną rozwiązane w nadchodzących wersjach Elementora.

Z dumą możemy również powiedzieć, że wydajność stała się integralną częścią naszego procesu opracowywania i wydawania. Każda wersja Elementora jest teraz weryfikowana pod kątem różnych wskaźników wydajności, aby upewnić się, że żadna nowa funkcja, ulepszenie ani poprawka nie ma negatywnego wpływu na istniejące witryny internetowe zbudowane za pomocą Elementora.

Teraz przejrzyjmy nasze utwory jeden po drugim:

Ulepszamy sposób, w jaki Elementor ładuje zasoby, aby upewnić się, że ładuje tylko to, czego potrzebuje na każdej stronie. W najnowszych wersjach zarówno Elementora, jak i Elementora Pro wprowadziliśmy zoptymalizowany eksperyment ładowania zasobów, aby poprawić wydajność front-endu witryny, przyspieszając każdą stronę, ładując tylko potrzebne funkcje. Więcej na ten temat dowiesz się tutaj.

Do niektórych widżetów dodaliśmy również opcje leniwego ładowania i będziemy to robić w przyszłości. Na przykład widżet Wideo zawiera opcję leniwego wczytywania, co daje możliwość zastąpienia osadzonego pełnego odtwarzacza wideo miniaturą statycznego obrazu. Obraz powróci do pełnego filmu, gdy użytkownik wejdzie z nim w interakcję.

Korzystając z tych leniwych technik ładowania, możesz znacznie zmniejszyć rozmiar strony i liczbę żądań HTTP podczas początkowego ładowania strony, co doprowadzi do znacznie szybszego korzystania z witryny przez odwiedzających.

Odkąd uruchomiliśmy Elementora prawie pięć lat temu, przeglądarki internetowe bardzo się rozwinęły. Teraz niektóre funkcje, które pięć lat temu wymagały zewnętrznych bibliotek, można zaimplementować przy użyciu natywnej obsługi przeglądarek. To sprawia, że ​​implementacja jest znacznie wydajniejsza, aw niektórych przypadkach może znacznie skrócić czas wykonywania JavaScriptu.

Jednym z przykładów jest biblioteka Waypoints, która w niektórych przypadkach została zastąpiona natywnym API Intersection Observer.

Naszym celem jest ograniczenie użycia tego typu bibliotek CSS i JavaScript oraz zastąpienie ich natywną obsługą przeglądarek tam, gdzie to możliwe.

Planujemy nadal ulepszać i optymalizować istniejący wewnętrzny JavaScript i CSS Elementora.

Przykładami tego są możliwość skonfigurowania metody ładowania czcionek Google oraz właściwość wyświetlania czcionek dodana do biblioteki Font Awesome. Te ulepszenia powinny ograniczyć procesy blokowania renderowania dla tych plików i zapewnić dodatkową optymalizację istniejących plików CSS i JS.

W Elementorze 3.0 poprawiliśmy mechanizm dynamicznego ładowania i renderowania CSS. Elementor używany do skanowania stron w poszukiwaniu elementów z wartościami dynamicznymi przy każdym ładowaniu strony. Począwszy od Elementora 3.0, gdy strona jest tworzona i odwiedzana po raz pierwszy, Elementor tworzy pamięć podręczną wszystkich elementów z wartościami dynamicznymi. Następnie zamiast skanować stronę w poszukiwaniu elementów dynamicznych za każdym razem, gdy strona jest odwiedzana, lista jest pobierana z pamięci podręcznej i natychmiast renderowana. To znacznie skraca czas renderowania po stronie serwera i powoduje zauważalną poprawę. Planujemy w przyszłości wdrożyć dodatkowe ulepszenia analizowania w Elementorze. Więcej na ten temat dowiesz się z tego wpisu na blogu.

Na koniec planujemy kontynuować ulepszanie i odchudzanie kodu wyjściowego, który generuje Elementor, aby zmniejszyć rozmiar DOM.

Zaczęliśmy już wprowadzać te ulepszenia w Elementorze 3.0, gdzie usunęliśmy trzy elementy opakowujące, aby utworzyć mniejszy DOM i uprościć kod wyjściowy.

W Elementorze 3.2 usunęliśmy jeszcze dwa elementy, aby osiągnąć jeszcze większą redukcję rozmiaru DOM. W najbliższej przyszłości planowane są kolejne redukcje.

Jak widać, nowych funkcji, ulepszeń i remontów można się spodziewać w 2021 roku i później. Wszystko to ma na celu pomóc Ci w dalszym tworzeniu niesamowitych witryn o lepszej wydajności. Jeśli nie zaktualizowałeś jeszcze do najnowszej wersji, upewnij się, że korzystasz z tych i innych ulepszeń.

Jak być może wiesz, istnieje wiele czynników niezwiązanych z Elementorem, które wpływają na wydajność Twojej witryny WordPress. Należą do nich optymalizacja obrazu, hosting, dostawcy serwerów, CDN i inne. Ponieważ naszym celem jest umożliwienie naszym użytkownikom wdrożenia pełnej optymalizacji WordPress, stworzyliśmy obszerny bank zasobów z bezpłatnymi samouczkami, seminariami internetowymi i artykułami, które pomogą Ci dowiedzieć się więcej o wydajności.

• Stworzyliśmy kurs wideo na temat wydajności — w tej pięcioczęściowej serii omawiamy każdy ważny czynnik, który może wpływać na wydajność, oraz sposoby jej optymalizacji.

• 28 kwietnia zorganizujemy seminarium internetowe na temat Core Web Vitals z czołowymi ekspertami SEO, aby omówić nadchodzącą zmianę algorytmu Google i jej wpływ na Twoje witryny. Zapisz tutaj swoje miejsce.

• Opublikowaliśmy również szczegółowy wpis na blogu na temat przyspieszenia witryn WordPress, a także inne artykuły dotyczące wydajności na takie tematy, jak wybór hostingu, wtyczki do buforowania, przeprowadzanie testów prędkości, korzystanie z WP Rocket i wiele innych.

Będziemy nadal tworzyć bezpłatne seminaria internetowe, posty na blogach i filmy, aby zająć się innymi aspektami wydajności WordPress, aby nadal wspierać społeczność twórców stron internetowych.