0Pricing
Angular Academy · Lesson

Enabling Full Hydration

Turn on hydration to avoid re-rendering.

Turning On Hydration

Full hydration is enabled by adding provideClientHydration() to your application providers. The ng add @angular/ssr schematic adds it for you.

import { provideClientHydration } from '@angular/platform-browser';

export const appConfig = {
  providers: [provideClientHydration()]
};

Where It Goes

It belongs in the browser appConfig providers, the same config used to bootstrap the client. The server config merges on top with provideServerRendering().

All lessons in this course

  1. What Is Hydration
  2. Enabling Full Hydration
  3. Incremental Hydration with @defer
  4. Measuring Core Web Vitals
← Back to Angular Academy