Integration

knockout-ssr strives to integrate easily into any application, with as little modifications and tweaking as possible. knockout-ssr will scan the document for "ssr" virtual elements. These special elements indicates to knockout-ssr to start server-side rendering, as well as providing the data used for the decendants.

<!-- ko ssr: { message: "Hello world!" } -->
  <p data-bind="text: message"></p>
<!-- /ko -->

Hydrating Server-side Rendered Views

The server-side rendered views requires custom hydration for some bindings. Import the knockout-ssr/runtime module globally in your applications. The module will register all ssr binding handlers once it is loaded.

import 'knockout-ssr/runtime';

Once the binding handlers are registered, you can run applyBindings as normally.

ko.applyBindings(...);

Using Data From Modules (View Models)

The special "ssr" virtual element allows for a module path to be provided. It will import the module and try to interoperate the data from the module.

<!-- ko ssr: ./my-viewmodel.js -->
  ...
<!-- /ko -->

The module specified should be capable of running server-side. You have two options for this:

1. Isomorphic Modules: The module is designed to run both on the browser and server-side. You should opt for isomorphic modules when possible.
2. Exclusive Modules: Alternatively, modules can be created to exclusively run server-side.