Nástroje Google PageSpeed - Google PageSpeed Tools - Wikipedia
 | Některé z tohoto článku uvedené zdroje nemusí být spolehlivý. (Březen 2017) (Zjistěte, jak a kdy odstranit tuto zprávu šablony) |
Google PageSpeed je rodina nástrojů od Google Inc., navržený na pomoc a optimalizace výkonu webových stránek.[1] To bylo představeno v Konference vývojářů v roce 2010.[2][3] Existují čtyři hlavní součásti nástrojů rodiny PageSpeed: Modul PageSpeed, skládající se z mod_pagespeed[4] pro Apache HTTP Server a ngx_pagespeed[5] pro Nginx,[6] PageSpeed Insights, Služba PageSpeed, a PageSpeed Chrome DevTools rozšíření. Všechny tyto komponenty jsou vytvořeny tak, aby identifikovaly chyby v souladu webových stránek s doporučenými postupy společnosti Google pro výkon webu a automatizovaly proces úprav.
Moduly PageSpeed
Moduly PageSpeed jsou open-source Apache HTTP Server nebo Nginx moduly webových serverů, které automaticky aplikují vybrané filtry na stránky a související aktiva, jako jsou šablony stylů, JavaScript, a HTML soubory, stejně jako obrázky a mezipaměť webových stránek požadavky. Největší výhodou těchto modulů je, že nevyžadují úpravy stávajícího obsahu nebo pracovního postupu,[7] což znamená, že všechny interní optimalizace a změny souborů se provádějí na straně serveru a představují upravené soubory přímo uživateli. Každý z více než 40 filtrů odpovídá jednomu z pravidel osvědčených postupů pro výkon webu Google.
Vzhledem k tomu, že modul PageSpeed je knihovna s otevřeným zdrojovým kódem, je často aktualizován řadou vývojářů z celého světa a lze jej nasadit na jakékoli jednotlivé weby, poskytovatelé hostingu nebo CDN.[8]
Instalace je relativně snadná a lze ji provést dvěma způsoby: z balíčků nebo sestavením ze zdroje na následujících podporovaných platformách:
Přístavy
Jiné servery, které nabízejí modul optimalizace PageSpeed založený na SDK PageSpeed Google:
- Apache Traffic Server - ats_pagespeed [9]
- Internetová informační služba Microsoft - IIS WebSpeed ←[10]
Filtry
Filtry modulu Pagespeed jsou nastavení, na základě kterých se použije pravidlo optimalizace webové stránky. Lze je rozdělit do pěti hlavních kategorií:
- Optimalizace seznamů stylů;
- Optimalizace souborů Javascript;
- Optimalizace obrázků;
- Optimalizace HTML;
- Filtry sledování aktivity.
Optimalizace seznamů stylů
Tyto filtry se mění CSS soubory do optimalizovaných verzí prostřednictvím jejich zmenšení, kombinace několika do jednoho nebo prodloužení životnosti mezipaměti:
| Název filtru | Popis |
|---|---|
| Zkombinujte CSS | Pokud stránka vyžaduje několik šablony stylů, tento filtr je kombinuje do jednoho šablony stylů, čímž se snižuje počet požadavků na a webový server |
| Rozšířit mezipaměť pro šablony stylů | Zvyšuje čas do mezipaměti CSS soubory mají být uchovávány v místní úložiště, zabraňující dalším požadavkům a načítání dat po návratu uživatele na stejnou webovou stránku |
| Sloučit import CSS | Nahradí všechna pravidla „@import“ obsahem importovaných souborů, pokud je velikost ovlivněna soubory stylů je menší než počet předem určených bytů nastavený dílčím filtrem „CssFlattenMaxBytes“. Tato optimalizace je navržena pro snížení počtu požadavků ze strany webový prohlížeč |
| Inline @import To Link | Transformuje pravidla „@import“ na odpovídající „“ značky. Většinou se používá pro správnou práci později použitých filtrů |
| Inline CSS | Vloží obsah malých externích souborů stylů přímo do HTML dokument, čímž se snižuje počet požadavků. Tento filtr se vztahuje pouze na šablony stylů které jsou menší než velikost nastavená dílčím filtrem „CssInlineMaxBytes“ |
| Inline Google Fonts API CSS | Vloží libovolné šablony stylů, který používá Google Font API, pokud jsou menší než hodnota, která je nastavena dílčím filtrem „CssInlineMaxBytes“ |
| Přesuňte CSS nad skripty | Přeskupí pořadí načítání šablony stylů a soubory javascript zajišťující, že skripty neblokují prostředky CSS. Vylepšuje vykreslování webové stránky, což vede ke kratší době načítání[11] |
| Přesuňte CSS do Head | Umístí zahrnutí seznamů stylů před zavedením jakýchkoli prvků , což snižuje čas načítání eliminací opětovných toků webové stránky[12] |
| Nastínit CSS | Experimentální filtr, který klade vložená pravidla CSS na externí zdroj. Myšlenkou je vytvořit paralelní připojení k různým serverům namísto po sobě jdoucích ke stejnému hostiteli. Tento filtr se pokusí nastínit pouze šablony stylů větší, než jsou nastaveny dílčím filtrem „CssOutlineMinBytes“ |
| Upřednostněte kritické CSS | Nahrazuje šablony stylů s vložkou CSS pravidla, obsahující pouze nezbytná pravidla pro počáteční výřez a odloží zbytek CSS pravidla, která se mají načíst po úplném načtení stránky |
| Přepište CSS | Umožňuje ostatním styl a filtry související s obrázky, které se mají použít na místní šablony stylů. Navíc tento filtr minifikuje všechny CSS. Má dopad na velikost užitečného zatížení |
| Přepište atributy stylu | Implementuje stejnou optimalizaci jako filtr „Přepsat CSS“ do všech pravidel, deklarovaný v atributech „| web = (Pomoc)| web = (Pomoc)| web = (Pomoc)| web = (Pomoc)| web = (Pomoc)| web = (Pomoc)| web = (Pomoc)| web = (Pomoc)| web = (Pomoc) |