JavaScript: Frameworky, knihovny a asynchronní programování

Co je JavaScript a proč je všudypřítomný

JavaScript je dynamický, prototypový, víceparadigmatický programovací jazyk, který běží jak v prohlížeči, tak na serveru. Původně vznikl pro zajištění interaktivity webu, dnes pohání front-end, back-end, mobilní i desktopové aplikace, CI/CD skripty, automatizaci i edge computing. Je standardizován jako ECMAScript (ES); každoroční specifikace definuje jazykové konstrukce, které implementují enginy (V8, SpiderMonkey, JavaScriptCore, Chakra/Node-Chakra v minulosti).

Jádro jazyka: hodnoty, typy a porovnávání

Primitiva: undefined, null, boolean, number, bigint, string, symbol.
Referenční typy: objekty a jejich odvozené struktury (Array, Map, Set, Date, RegExp atd.).
Koercí: JavaScript provádí implicitní převody (např. '2' * 3 → 6), které mohou být překvapivé; při porovnávání preferujte === (striktní rovnost) před ==.
Nečíselné hodnoty: NaN znamená „not a number“ a není rovno ničemu, ani sobě samému; testujte pomocí Number.isNaN().

Prototypová dědičnost a objektový model

JavaScript využívá prototypy: každý objekt má interní odkaz na „prototyp“ (řetězec prototypů). „Třídy“ (class) představují syntaktický cukr nad prototypovým modelem. Metody jako Object.create() nebo Object.setPrototypeOf() umožňují detailní kontrolu nad dědičností a složením chování.

Rozsahy, uzávěry (closures) a vazba this

Lexikální rozsah: let a const jsou blokově omezené; var má funkční rozsah a je hoistován – upřednostňujte moderní deklarace.
Uzávěry: funkce „pamatují“ si prostředí, ve kterém vznikly – základ pro modularitu, memoizaci a funkcionální techniky.
this: hodnota závisí na způsobu volání. Šipkové funkce (=>) nevytvářejí vlastní this (dědí lexikální hodnotu), klasické funkce ano; k řízení použijte call/apply/bind.

Asynchronní model: event loop, Promise a async/await

JavaScript je jednovláknový s event loopem. I/O operace a časovače běží mimo hlavní vlákno a zpět plánují úlohy pomocí front task a microtask (microtasky – například vyřízení Promise – mají vyšší prioritu). async/await staví na Promise a zjednodušuje asynchronní kód; nezapomínejte na použití try/catch a paralelizaci pomocí Promise.all().

Moduly: ES Modules (ESM) vs. CommonJS

ESM: import/export, statická analýza, tree-shaking, nativně podporovány v prohlížečích i Node.js (s type="module" nebo příponou .mjs).
CommonJS: require()/module.exports, dynamické načítání, starší standard v Node.js. V nových projektech se doporučuje ESM; interoperabilita vyžaduje pečlivost.

Standardní knihovna a užitečné struktury

Kolekce: Map/Set (deterministická iterace, bez kolizí klíčů, jako u prostých objektů), WeakMap/WeakSet pro cache s garbage collection.
Iterátory a generátory: protokol Symbol.iterator; generátory (function*) umožňují lazy sekvence a kontrolované iterace.
Symboly: unikátní klíče vlastností, integrace s interními protokoly (např. Symbol.toStringTag).
Intl API: formátování čísel, měn, dat, relativního času (i18n bez závislostí na externích knihovnách).

JavaScript a web: DOM, události a Web API

DOM a události: moderní selekce (querySelector), delegace událostí, pasivní posluchači pro scroll/touch ({ passive: true }).
Fetch a Streams: fetch s AbortControllerem, Readable a Writable Streams pro práci s velkými daty.
Web Workers a Worklets: paralelní výpočty mimo UI vlákno; AudioWorklet, PaintWorklet pro nízkoúrovňové scénáře.
Service Worker a PWA: offline cache, synchronizace na pozadí, push notifikace – klíčové pro progresivní webové aplikace.

Server-side JavaScript: Node.js, Deno a Bun

Node.js: de facto standard na serveru, bohatý ekosystém NPM, modulární architektura (cluster, worker_threads), nativní Test Runner a podpora fetch.
Deno: bezpečnost založená na oprávněních, ESM a importy z URL, vestavěná podpora TypeScriptu.
Bun: zaměřený na výkon (rychlý runtime, bundler, test runner, bun install), kompatibilita s Node API.

Nástroje, balíčkování a build

Správa balíčků: npm, pnpm, Yarn; lockfile pro reprodukovatelné sestavení, workspaces pro monorepa.
Bundlery a transformace: Vite, esbuild, Rollup, Webpack; transpilace pomocí Babel pro kompatibilitu.
Lint & formátování: ESLint s pravidly (např. typescript-eslint), formátování pomocí Prettier.
Testování: Vitest, Jest, Mocha pro unit a integrační testy, Playwright/Cypress pro end-to-end testy.

Bezpečnost: XSS, CSRF, supply chain

XSS: sanitizace vstupů, Content-Security-Policy, použití textContent místo innerHTML pro uživatelská data.
CSRF: same-site cookies, CSRF tokeny, idempotentní návrh API.
Supply chain: audit závislostí (npm audit, lockfile signing), pinování verzí, minimalizace množiny balíčků.
Sandboxing: princip nejmenších oprávnění (Deno permissions, izolace workerů), vyhýbání se eval.

Výkon: měření, profily a optimalizace

Měření: Performance API, Lighthouse, User Timing, RUM metriky (FCP, LCP, INP).
Optimalizace kódu: vyhýbat se skrytým megamorfním voláním, upřednostňovat monomorfismus objektů, minimalizovat mikrooptimalizace v kritických cestách.
Načítání: code-splitting, lazy-loading, preload/prefetch, minimalizace velikosti JS „payloadu“.
Výkon UI: batchování změn DOM, requestAnimationFrame, IntersectionObserver.

Architektury front-endu: SPA, SSR, SSG, ISR a edge

SPA: rychlé interakce, ale nároky na klientský JavaScript a SEO; řešení zahrnují hydratační strategie a islands architekturu.
SSR/SSG: serverové renderování pro rychlý první obsah; incremental static regeneration pro částečné obnovy stránek.
Edge render: serverové komponenty a middleware běžící blízko uživatele, s cílem nižší latence.

Ekosystém frameworků a knihoven

UI knihovny: React (včetně serverových komponent), Vue, Svelte, Solid – každá nabízí jiný kompromis mezi reaktivitou a ergonomií.
Meta-frameworky: Next.js, Nuxt, SvelteKit, Astro – poskytují routing, data-fetching, renderingové režimy a build pipeline.
Stav a data: Redux Toolkit, Zustand, Vuex/Pinia, tanstack/query (kešování serverových dat), Signals přístupy pro jemnozrnnou reaktivitu.

TypeScript a typování v JS světě

TypeScript přináší strukturální typování, které usnadňuje údržbu rozsáhlých kódových základen. V čistém JavaScriptu lze využít JSDoc anotace a checkJs pro postupné zavádění typování. Klíčové je udržovat typovou smlouvu na vstupu a výstupu modulů (například generováním typů ze schémat API).

Práce s daty: JSON, binární formáty a čas

JSON: JSON.parse a JSON.stringify, pozor na bezpečnost (nenařizujte serializaci funkcí, validujte schématy – AJV).
Binární data: ArrayBuffer, TypedArray, DataView, URL.createObjectURL pro práci s blob zdroji.
Čas a datum: Date má omezení; doporučuje se používat osvědčené knihovny nebo moderní API v bězích, které je podporují. Zásadní je uchovávat data v UTC v doménové vrstvě a formátovat je až na rozhraní aplikace.

API vrstvy a síťová komunikace

REST: idempotentní HTTP metody, správné kódy odpovědí, ETag a cache.
GraphQL: přesné dotazy na data, ale pozor na problém N+1 a složité resolvery; využívání persisted queries.
WebSocket/SSE: push v reálném čase, strategie backoff, heartbeat a probe mechanismy.

Průmyslové vzory a idiomy

Kompozice místo dědičnosti: funkce vracející chování (factory), mixiny, moduly s explicitními rozhraními.
Imutabilita dat: kopie pomocí spread operátorů ({ ...obj }, [...arr]), funkcionální aktualizace, vyhýbání se neviditelným vedlejším efektům.
Tenké komponenty a rozsáhlé domény: UI jako pohled na stav, doménová logika v samostatných modulech.

Testovatelnost a kvalita

Unit testy: izolace, determinismus, malé a jasné API povrchy.
Integrační a E2E testy: testovací identity, seedované databáze, kontraktní testy vůči mock serverům.
Statická analýza: ESLint pravidla, eliminace mrtvého kódu, přezkum závislostí.

Observabilita a provoz

Logování: strukturované logy (JSON), korelační ID, ochrana citlivých dat.
Metriky a tracing: Web Vitals, aplikační metriky, OpenTelemetry; upozornění na symptomy, nejen na prahy.
Strategie rolloutů: canary deployment, feature flagy, postupné nasazování, automatický rollback.

Časté chyby a jak se jim vyhnout

Globální stav a vedlejší efekty: enkapsulace do modulů, jasná rozhraní, čisté funkce, kde je to vhodné.
Nezvládnuté Promise: vždy vracejte nebo await; ošetřujte chyby (.catch / try/catch), vyvarujte se „plovoucích Promise“.
Přetížení klienta JS: minimalizace bundle, serverové renderování, rozumné hydratační strategie.
Nedůsledná typová smlouva: validace vstupů na okrajích aplikace, generování typů ze schémat.