Kluby

Zainspirowany aktywnościami na czytanych blogach, zapisałem się ostatnio do klubów. Kluby są dwa: 512 KB oraz 250 KB. Pierwszy dotyczy rozmiaru strony nieskompresowanej, drugi – moim zdaniem istotniejszy – skompresowanej. Znaczy wykonana została optymalizacja WordPress.

Niby nic nowego, bo o optymalizacji strony i poprawnym działaniu na urządzeniach moblilnych pisałem już dawno. Jednak z WordPressa o rozmiarze nieskompresowanym mniejszym niż 512 KB jestem zadowolony. Tym bardziej, że chodzi o wersję z dodatkowymi statystykami Matomo. Okazuje się, że nie potrzeba żadnej magii, by osiągnąć taki wynik. Nawet motyw jest jeden z domyślnych.

Tak, to tylko główna. Poszczególne wpisy są nieco większe. Tak, nie mam obrazków we wpisach. Z obrazkami na głównej byłoby więcej. Z drugiej strony mógłbym zmniejszyć liczbę wpisów. Ale nie o to chodzi, przynajmniej mi. Nie musi być jak najmniej, ważne, by zwrócić uwagę na rozmiar przy zachowaniu wyglądu i funkcjonalności. Czyli żeby nie było bloatu.

Jeśli komuś naprawdę zależy na minimalizacji, to jedynym sensownym kierunkiem wydaje mi się strona statyczna. Statycznych generatorów stron/blogów jest wiele. Podzielone językami i licencjami, czyli dla każdego coś miłego. Do tego lekki motyw i wyniki są nieporównywalnie lepsze. Co można zobaczyć na przykładzie Wattmeter (geneza). Niestety, funkcjonalność jakby nie ta. Przede wszystkim brakuje sensownej możliwości spięcia komentarzy.

Swoją drogą fajnie widać, jak na przestrzeni lat zmieniają się narzędzia do badania optymalizacji strony. Kiedyś korzystałem z surowo wyglądającego webpagetest.org, teraz rządzi znacznie ładniejszy GTmetrix.

Puchną także same strony. Strona główna starego bloga (Jogger.pl) to 27 requestów, 227 KB skompresowane, 674 KB nieskompresowane. Jednak od obu tych wartości należałoby odjąć odpowiednio 152 KB oraz 461 KB związane z reklamami i widgetem wyszukiwarki Google. Czyli zostałoby 75 KB oraz 213 KB, przed jakąkolwiek optymalizacją. Ten blog ma 11 requestów i odpowiednio 102 KB i 334 KB, ale już po optymalizacji. Czyli jakąś połowę więcej.

Optymalizacja WordPress

Do odchudzania strony głównej, czyli optymalizacji WordPressa korzystałem z wtyczki Asset CleanUp. Więcej o polecanych/używanych wtyczkach WordPress pisałem pisałem tu, więc aktualizuję.

Gdyby ktoś chciał powalczyć samodzielnie to poniżej instrukcja, albo raczej krótkie wskazówki na temat tego, co ustawiłem w tej wtyczce. Nie jest to komplet zmian optymalizacyjnych, część rzeczy mogę robić w innych wtyczkach lub samym serwerze WWW. Czyli klasyczne YMMV, a każda zmiana wymaga testów.

  • Optimize CSS – wszystkie opcje włączone. Defer, minimize, cache.
  • Optimize JavaScript – nie dotykany.
  • HTML Source CleanUp – usunięte kilka tagów. Nie podaję które, bo mocno zależy od konfiguracji.
  • Google Fonts – włączone Remove Google Fonts. Widać różnicę w wyglądzie, ale na testach wyszło mi, że jest tylko odrobinę gorzej. Różnica w rozmiarze – znaczna.
  • CSS & JS Manager – ze strony głównej (i tylko z niej!) usunąłem ładowanie plugina Subscribe to Comments Reloaded. Jest potrzebny tylko na stronach wpisów. Podobny los spotkał tam jquery-core oraz jquery-migrate.

Wtyczki do WordPressa

Przesiadka na WordPressa była dobrym posunięciem. Jednak ku mojemu zdziwieniu goły WordPress nie ma możliwości zrobienia – przynajmniej w prosty, cywilizowany sposób – wielu podstawowych rzeczy. Musiałem doinstalować pewne wtyczki, a po bliższym zapoznaniu się z tematem okazało się, że trafiają się tam naprawdę rewelacyjne narzędzia.

Wtyczki WordPress podzieliłem – bardzo subiektywnie – na dwie grupy – trzeba mieć oraz warto mieć. Zwykle będą to najniezbędniejsze narzędzia do podstawowych funkcjonalności, zdrowego SEO oraz narzędzia do optymalizacji bloga, zwł. czasu ładowania strony. Pora na grupę pierwszą, czyli pluginy IMO niezbędne:

BackWPup


Niezależnie od tego, czy masz własny serwer, korzystasz z hostingu który „robi backupy” czy kupujesz gotowca, warto mieć własną kopię zapasową. BackWPup robi robotę, ma sporo opcji konfiguracyjnych co backupować i gdzie przesyłać backup (tu akurat średnio jestem przekonany, IMO lepiej zaciągać backup, niż go wysyłać z backupowanej maszyny). Potrafi działać cyklicznie, bez ingerencji, umie zrobić pełną kopię, wraz ze zdjęciami. Przypadł mi do gustu, więc nie testowałem alternatyw.

UPDATE Polecam, choć ostatecznie przesiadłem się na kopię plików + dump bazy realizowane z poziomu systemu operacyjnego.

Advanced noCaptcha & invisible Captcha


Że spam na blogu może się zdarzyć – wiadomo. Miałem włączoną moderację, więc nic się nie prześlizgnęło, ale spamu wpadała cała masa. W przeciwieństwie do mniej popularnych platform blogowych, blogi oparte o WordPress są narażone na automatyczne znajdowanie przez boty, a wtedy… przychodzi nawet po kilka spamów dziennie. Moderowanie szybko mi się znudziło, różnego rodzaju rozwiązania antyspamowe mnie nie do końca przekonywały, postawiłem na standardowe rozwiązanie od Google. Ujęło mnie tym, że potrafi zabezpieczyć nie tylko formularz komentarzy, ale także logowanie. Znacznie utrudnia to atak brute force (chociaż nie powstrzyma zdesperowanego atakującego, są rozwiązania do łamania CAPTCHA od Google). Prosta, standardowa konfiguracja, do wyboru różne warianty captcha, w tym wersja niewidoczna. Spam niemal zniknął, pojedyncze sztuki w miesiącu to raczej robota ludzi.

UPDATE Działało do czasu, potem przestało.

hCaptcha for WordPress

Zamiennik reCAPTCHA. Dzielnie radził sobie ze spamem, gdy ten zaczął przechodzić rozwiązanie od Google. Do czasu, aż znowu spamerzy zaczęli wygrywać. Ale i tak uważam plugin za bardzo dobry i polecam.

Antispam Bee

Ta wtyczka, jak nazwa wskazuje, służy do wycinania spamu. Gdy hCaptcha przestała dawać radę, zainstalowałem i jestem zadowolony. Sporo opcji, można pozwolić tylko na komentarze w danym języku, powiadomienia na maila, usuwać wykryty spam po zadanym czasie. Działa przed moderacją, więc może skutecznie odciążyć moderatora.

Download External Images In Posts


Znalazłem go poszukując sposobu na zaimportowanie obrazków podczas migracji z Blox i w sumie zrobił mi dzień. Działa w ten sposób, że pobiera zdalne obrazki i zapisuje je lokalnie, następnie serwuje z naszego serwera. Dzięki temu blog ładuje się szybciej (brak odwołań do wielu domen), mamy pełną kontrolę nad treścią i gwarancję jej niezmienności. Warto tu przypomnieć, że należy podawać źródło, skąd pochodzi dany obrazek na naszym blogu. Jeśli mamy ten plugin to odwiedzający nie może nawet „po prostu” zajrzeć w źródło, żeby to sprawdzić. Drobną wadą jest to, że nasz blog zajmuje nieco więcej miejsca. W końcu wszystkie zasoby są przechowywane u nas. Jednak przy dzisiejszych pojemnościach i cenach hostingu nie powinien być to żaden problem.

Najważniejsze wtyczki za nami, pora na mniej istotne.

Insert Headers and Footers


Potrzebowałem dodać statystyki Matomo (dawniej Piwik) i… okazało się, że w gołym WordPressie nie bardzo można to zrobić. Oczywiście do wszystkiego są dedykowane pluginy, ale jeśli ktoś – podobnie jak ja – przywykł do tego, że sam robi odpowiednie wklejki w stopce, to jest to plugin w sam raz dla niego. Nie szukałem alternatyw.

Cache Enabler


Z tym pluginem jest śmieszna historia. Tak naprawdę nie chodziło mi o cache czy różnego rodzaju funkcje optymalizacyjne (to już miałem zrobione, czy to natywnie w serwerze WWW, czy ręcznie), tylko o funkcję ukrytą pod nazwą create an additional cached version for WebP image support. Okazało się, że jest to – a przynajmniej był – najprostszy sposób, by zmusić WordPressa do serwowania grafik w formacie WebP przeglądarkom, które ten format umieją.

EWWW Image Optimizer


Narzędzie do optymalizacji grafik przechowywanych lokalnie. Mocno konfigurowalne, klikalne, potrafi bezstratnie (oraz stratnie, jeśli ktoś woli i wybierze taką opcję) optymalizować rozmiar zdjęć, dzięki czemu blog zajmuje mniej miejsca i wczytuje się szybciej. Potrafi też dokonywać przeskalowania grafik, dzięki czemu wysyłana jest nie tylko zoptymalizowana, ale najbliższa danemu rozmiarowi ekranu wersja. Domyślnie korzysta z zainstalowanych dodatkowych programów, więc nie jestem przekonany, czy będzie działał na shared hostingach. Jeśli ktoś ma swój VPS – polecam.

Google XML Sitemaps


Goły WordPress posiadał szczątkową sitemapę, albo wręcz jej nie posiadał. Plugin załatwia sprawę generowania sitemapy, która ułatwia poprawne zaindeksowanie treści. Jest sporo alternatyw w różnych wtyczkach do SEO, ten plugin spodobał mi się, bo nie jest kombajnem, robi tylko sitemapę.
UPDATE Aktualnie zrezygnowałem z tej wtyczki na rzecz kolejnej, czyli Yoast SEO.

Yoast SEO

Kombajn do SEO, któremu dałem szansę w wersji darmowej. Potrafi zwrócić uwagę zarówno na jakość wpisów pod kątem czytelności, jak i SEO. Brak podziału długiego wpisu przy pomocy nagłówków, za długie zdania – ta wtyczka WordPress pomaga rozwiązać tego typu problemy. Można zaznaczyć kolorowanie problematycznych zdań, zdefiniować frazy kluczowe. Ponadto umie zrobić sitemapę, podgląd wpisu w mediach społecznościowych i wiele innych rzeczy. Nadal testuję, ale wygląda dobrze, żałuję, że nie znałem wcześniej.

Subscribe to Comments Reloaded


Chciałem dać czytelnikom często spotykaną na innych blogach i często przeze mnie wykorzystywaną możliwość subskrypcji komentarzy do danego wpisu, stąd jego obecność. Zachwalana funkcjonalność nie spotkała się z szerszym zainteresowaniem, ale samo rozwiązanie wydaje się działać OK. Na niedziałanie nikt się nie skarżył, alternatyw nie szukałem.

Asset CleanUp: Page Speed Booster

Wtyczka WordPress pomocna przy odchudzaniu strony. Pozwala łatwo, bez grzebania w CSS, określić które elementy chcemy wyłączyć. Konfiguracja jest zaawansowana, można wyłączać tylko określone elementy na określonych typach stron.

Tyle jeśli chodzi o wtyczki WordPress, jeśli znasz inne ciekawe, podziel się nimi w komentarzach. Jeśli potrzebujesz pomocy z konfiguracją WordPressa – zapraszam do działu kontakt.