Hydration
Hydration connects existing browser HTML with its application logic. Visible content and working interaction require separate checks.
Connect existing HTML with application logic
In web development, hydration connects previously generated HTML with its client-side application logic. A framework in the browser can then manage an initially displayed interface. The HTML may come from SSR or SSG, for example.
In a fictional React portal, a product view is already readable while its associated logic is still starting. Only afterwards does the interactive quantity selector work as intended. A visible button alone therefore does not establish readiness.
During hydration, React expects the initial browser output to match the delivered HTML. Different starting data can cause errors. Hydration is neither reloading all business data nor an automatic guarantee of fast interaction. Check when important actions are actually ready.
Sources
Related terms
- Server-side renderingServer-side rendering produces HTML on the server. Freshness, personalisation and speed also depend on data access and caching.
- Static site generationStatic site generation creates pages as files in advance. Changes to source data must also reach the output served to users.
- JavaScriptJavaScript is a programming language for application logic, in browsers and elsewhere. Its role differs from HTML and CSS.
- Legacy systemAn existing system still in use, with technical and business dependencies accumulated over time.
- Multi-tenancyMulti-tenancy supports separate customer or group scopes in one solution. A tenant is not automatically one person or one database.
- Browser cacheThe browser cache stores suitable HTTP responses for later use. Reuse and revalidation follow the applicable rules.
Articles on this topic
Software Development with ASES
Custom software, web and mobile apps