Co nejvíce zpomaluje načítání webu a jak to poznat?

U async akcí (například pomocí thunk middleware) je situace odlišná, protože potřebujete simulovat API volání. Nejlepší je použít knihovnu pro mockování, která vám umožní nahradit skutečné HTTP volání fiktivní odpovědí. Vytvoříte si mock pro funkci, která má provést fetch, a poté zavoláte async akci. Nezapomeňte, že async akce vrací Promise – test musí být asynchronní, aby počkal na dokončení. Typická chyba je zapomenout na to, že thunk funkce má podpis (dispatch, getState) => Promise, a testovat ji jako obyčejnou funkci bez dispatch.

Když pracujete na více feature větvích současně, první chyba, kterou většina vývojářů udělá, je, že si myslí, že stačí větve pravidelně mergeovat do hlavní vývojové linie. To ale obvykle vede k tomu, že se konflikty hromadí a jejich řešení zabere víc času než samotná implementace. Základem je udržovat každou větev co nejkratší a co nejčastěji ji synchronizovat se zdrojovou větví. Ideální je si před začátkem práce na nové funkci definovat, jak dlouho bude větev žít, a pokud to přesáhne pár dní, rozdělit práci na menší části.

Dalším častým problémem je, že vývojáři řeší konflikty až ve chvíli, kdy je to nutné, tedy při mergování do hlavní větve. To je špatně, protože konflikt může být tak velký, že nebudete rozumět vlastnímu kódu, natož kódu kolegy. Místo toho si vždy před mergem udělejte takzvaný dry-run: zkuste větev mergnout do hlavní větve v samostatné větvi nebo v lokální kopii. Tím zjistíte, kde konflikty vznikají, a můžete je řešit v klidu, bez časového tlaku.

První unit test obvykle vzniká z dobrého úmyslu, ale často končí jako formalita, kterou nikdo nečte. Než začnete psát, rozhodněte se, co má test dokazovat. Nemá smysl testovat, že metoda vrací očekávanou hodnotu, když ji nikdo nepoužívá. Zaměřte se na chování, které je důležité pro byznys logiku, nebo na okrajové případy, které by mohly způsobit chybu v produkci.

Další častou chybou je zbytečné načítání všech sloupců. Místo SELECT * si napište pouze ty sloupce, které skutečně potřebujete. Tím se sníží objem přenášených dat a v některých případech může databáze použít i tzv. covering index, který obsahuje všechny požadované hodnoty a nemusí přistupovat k samotné tabulce. To platí dvojnásob, pokud pracujete s tabulkami, které mají mnoho sloupců nebo obsahují velké textové hodnoty. Optimalizace dotazu není jen o tom, co se provádí, ale také o tom, kolik dat se zbytečně tahá mezi databází a aplikací.

Častou chybou je testovat všechny scénáře najednou – místo toho rozdělte testy na malé jednotky. Pro každou akci připravte samostatný test pro úspěch a pro selhání. U reducerů testujte každý případ zvlášť, včetně neznámých akcí, které by měly vrátit stejný stav. Také je dobré testovat stav po více po sobě jdoucích akcích, abyste ověřili, že se stav správně skládá. Nezapomeňte na okrajové případy, jako je prázdný seznam nebo neplatný payload – tyto testy často odhalí chyby, které by jinak zůstaly skryté.

Dalším častým problémem je příliš mnoho HTTP požadavků. Každý soubor — ať už obrázek, šablona nebo skript — znamená jedno spojení se serverem. Sloučte menší soubory do jednoho a skripty načtěte až na konci stránky, aby neblokovaly vykreslování. Využijte atribut defer nebo async, ale pozor na to, že async může porušit pořadí, pokud na sobě skripty závisí. Pokud používáte redakční systém, nainstalujte si plugin pro cachování, který vytváří statické kopie stránek a odlehčuje serveru.

Užitečným trikem je také pravidelné rebaseování před každým pushnutím. Pokud pracujete na větvi déle než den, měli byste si ji rebasovat na hlavní větev alespoň jednou denně. Tím minimalizujete rozsah konfliktů, protože se mění jen malá část kódu. Ale pozor, rebase po pushnutí vyžaduje force push, což je nebezpečné, pokud na větvi pracujete s někým dalším. Vždy si ověřte, že nikdo jiný nemá lokální kopie větve, a pokud ano, domluvte se předem na tom, jak budete postupovat.

Při psaní testů se vyhněte dvěma častým chybám. První je testování osvětlení v obývákuíce věcí najednou. Jeden test = jedno očekávání. Pokud máte v jednom testu pět různých tvrzení, při selhání nevíte, která část kódu je rozbitá. Druhým problémem jsou testy, které spoléhají na pořadí provedení nebo na sdílený stav. Každý test by měl být nezávislý, aby se dal spustit samostatně.

Layout stránky dnes nejlépe vyřešíte pomocí flexboxu nebo CSS gridu. Flexbox je vhodný pro řazení prvků v jedné ose (například navigace s odkazy), grid pro dvourozměrné rozvržení (hlavní oblast a postranní panel). Základní flexbox: na rodičovském prvku nastavte display: flex, děti se automaticky seřadí do řádku. Můžete pak pomocí justify-content: space-between rozmístit prvky s mezerami nebo gap pro jednotné mezery. U gridu definujte sloupce přes grid-template-columns: 1fr 3fr – první sloupec zabere čtvrtinu, druhý tři čtvrtiny. Nezapomeňte na responsivní chování – s dotazem @media (max-width: 600px) můžete přepnout rozložení na jeden sloupec.

Should you have just about any concerns with regards to in which as well as the best way to employ další informace, it is possible to call us at our own web-page.