diff --git a/blog/2019-05-20-new-documentation.md b/blog/2019-05-20-new-documentation.md
index e772338..f3c0acb 100644
--- a/blog/2019-05-20-new-documentation.md
+++ b/blog/2019-05-20-new-documentation.md
@@ -8,5 +8,7 @@ tags: [hello, podium]
 Welcome to our blog. Our documentation site has just gotten an refreshing update
 which also give us a blog.
 
+<!--truncate-->
+
 This space will be used to document version changes and give insight in tips and
 tricks not really belonging in the documentation itself.
diff --git a/docs/api/layout.md b/docs/api/layout.md
index c2cba9d..3d9eeb9 100644
--- a/docs/api/layout.md
+++ b/docs/api/layout.md
@@ -640,17 +640,19 @@ assets.
 
 #### options
 
-| option         | type      | default   | required | details                                                                                      |
-| -------------- | --------- | --------- | -------- | -------------------------------------------------------------------------------------------- |
-| value          | `string`  |           | &check;  | Relative or absolute URL to the JavaScript asset                                             |
-| prefix         | `boolean` | `false`   |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
-| type           | `string`  | `default` |          | What type of JavaScript (eg. esm, default, cjs)                                              |
-| referrerpolicy | `string`  |           |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| crossorigin    | `string`  |           |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| integrity      | `string`  |           |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| nomodule       | `boolean` | `false`   |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| async          | `boolean` | `false`   |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| defer          | `boolean` | `false`   |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| option         | type                                                  | default              | required | details                                                                                      |
+| -------------- | ----------------------------------------------------- | -------------------- | -------- | -------------------------------------------------------------------------------------------- |
+| value          | `string`                                              |                      | &check;  | Relative or absolute URL to the JavaScript asset                                             |
+| strategy       | `"beforeInteractive" \| "afterInteractive" \| "lazy"` | `"afterInteractive"` |          | Specify how the JavaScript should be loaded                                                  |
+| scope          | `"content" \| "fallback" \| "all"`                    | `"all"`              |          | Specify what routes the JavaScript should apply to                                           |
+| prefix         | `boolean`                                             | `false`              |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
+| type           | `string`                                              | `default`            |          | What type of JavaScript (eg. esm, default, cjs)                                              |
+| referrerpolicy | `string`                                              |                      |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| crossorigin    | `string`                                              |                      |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| integrity      | `string`                                              |                      |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| nomodule       | `boolean`                                             | `false`              |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| async          | `boolean`                                             | `false`              |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| defer          | `boolean`                                             | `false`              |          | Correlates to the same attribute on a HTML `<script>` element                                |
 
 ##### value
 
@@ -925,18 +927,20 @@ assets.
 
 #### options
 
-| option      | type      | default      | required | details                                                                                      |
-| ----------- | --------- | ------------ | -------- | -------------------------------------------------------------------------------------------- |
-| value       | `string`  |              | &check;  | Relative or absolute URL to the CSS asset                                                    |
-| prefix      | `boolean` | `false`      |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
-| crossorigin | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| disabled    | `boolean` | `false`      |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| hreflang    | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| title       | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| media       | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| type        | `string`  | `text/css`   |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| rel         | `string`  | `stylesheet` |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| as          | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| option      | type                                                                  | default               | required | details                                                                                      |
+| ----------- | --------------------------------------------------------------------- | --------------------- | -------- | -------------------------------------------------------------------------------------------- |
+| value       | `string`                                                              |                       | &check;  | Relative or absolute URL to the CSS asset                                                    |
+| strategy    | `"beforeInteractive" \| "afterInteractive" \| "lazy" \| "shadow-dom"` | `"beforeInteractive"` |          | Specify how the CSS should be loaded                                                         |
+| scope       | `"content" \| "fallback" \| "all"`                                    | `"all"`               |          | Specify what routes the CSS should apply to                                                  |
+| prefix      | `boolean`                                                             | `false`               |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
+| crossorigin | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| disabled    | `boolean`                                                             | `false`               |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| hreflang    | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| title       | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| media       | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| type        | `string`                                                              | `text/css`            |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| rel         | `string`                                                              | `stylesheet`          |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| as          | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
 
 ##### value
 
diff --git a/docs/api/podlet.md b/docs/api/podlet.md
index b3c57e0..14173a8 100644
--- a/docs/api/podlet.md
+++ b/docs/api/podlet.md
@@ -234,16 +234,17 @@ const podlet = new Podlet(options);
 
 #### options
 
-| option      | type      | default          | required | details                                                 |
-| ----------- | --------- | ---------------- | -------- | ------------------------------------------------------- |
-| name        | `string`  | `null`           | &check;  | Name that the Podlet identifies itself by               |
-| pathname    | `string`  | `null`           | &check;  | Pathname of where a Podlet is mounted in an HTTP server |
-| version     | `string`  | `null`           | &check;  | The current version of the podlet                       |
-| manifest    | `string`  | `/manifest.json` |          | Defines the pathname for the manifest of the podlet     |
-| content     | `string`  | `/`              |          | Defines the pathname for the content of the podlet      |
-| fallback    | `string`  | `null`           |          | Defines the pathname for the fallback of the podlet     |
-| logger      | `object`  | `null`           |          | A logger which conforms to a log4j interface            |
-| development | `boolean` | `false`          |          | Turns development mode on or off                        |
+| option       | type      | default          | required | details                                                                                           |
+| ------------ | --------- | ---------------- | -------- | ------------------------------------------------------------------------------------------------- |
+| name         | `string`  | `null`           | &check;  | Name that the Podlet identifies itself by                                                         |
+| pathname     | `string`  | `null`           | &check;  | Pathname of where a Podlet is mounted in an HTTP server                                           |
+| version      | `string`  | `null`           | &check;  | The current version of the podlet                                                                 |
+| manifest     | `string`  | `/manifest.json` |          | Defines the pathname for the manifest of the podlet                                               |
+| content      | `string`  | `/`              |          | Defines the pathname for the content of the podlet                                                |
+| fallback     | `string`  | `null`           |          | Defines the pathname for the fallback of the podlet                                               |
+| logger       | `object`  | `null`           |          | A logger which conforms to a log4j interface                                                      |
+| development  | `boolean` | `false`          |          | Turns development mode on or off                                                                  |
+| useShadowDOM | `boolean` | `false`          |          | Wrap the podlet contents in [declarative shadow DOM for isolation](/docs/guides/assets#isolation) |
 
 ##### name
 
@@ -667,7 +668,7 @@ Console is also supported for easy test / development.
 
 ```js
 const podlet = new Podlet({
-    logger: console;
+  logger: console,
 });
 ```
 
@@ -676,7 +677,27 @@ further details.
 
 ##### development
 
-Turns development mode on or off. See the section about development mode.
+Turns development mode on or off. See [Podlet development](/docs/guides/podlet-development/).
+
+##### useShadowDOM
+
+Wrap the podlet in declarative shadow DOM for isolation.
+
+When `useShadowDOM` is set to true, name must be valid [custom element name](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#name).
+
+Any CSS added must set `strategy: "shadow-dom"` so it can be linked to and apply inside of the shadow DOM.
+
+```js
+const podlet = new Podlet({
+  name: "my-podlet",
+  useShadowDOM: true,
+});
+
+podlet.css({
+  value: "https://cdn.site.com/my-podlet.css",
+  strategy: "shadow-dom",
+});
+```
 
 ## Podlet Instance
 
@@ -1277,17 +1298,19 @@ assets.
 
 #### options
 
-| option         | type      | default   | required | details                                                                                      |
-| -------------- | --------- | --------- | -------- | -------------------------------------------------------------------------------------------- |
-| value          | `string`  |           | &check;  | Relative or absolute URL to the JavaScript asset                                             |
-| prefix         | `boolean` | `false`   |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
-| type           | `string`  | `default` |          | What type of JavaScript (eg. esm, default, cjs)                                              |
-| referrerpolicy | `string`  |           |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| crossorigin    | `string`  |           |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| integrity      | `string`  |           |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| nomodule       | `boolean` | `false`   |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| async          | `boolean` | `false`   |          | Correlates to the same attribute on a HTML `<script>` element                                |
-| defer          | `boolean` | `false`   |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| option         | type                                                                  | default              | required | details                                                                                      |
+| -------------- | --------------------------------------------------------------------- | -------------------- | -------- | -------------------------------------------------------------------------------------------- |
+| value          | `string`                                                              |                      | &check;  | Relative or absolute URL to the JavaScript asset                                             |
+| strategy       | `"beforeInteractive" \| "afterInteractive" \| "lazy" \| "shadow-dom"` | `"afterInteractive"` |          | Specify how the JavaScript should be loaded                                                  |
+| scope          | `"content" \| "fallback" \| "all"`                                    | `"all"`              |          | Specify what routes the JavaScript should apply to                                           |
+| prefix         | `boolean`                                                             | `false`              |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
+| type           | `string`                                                              | `default`            |          | What type of JavaScript (eg. esm, default, cjs)                                              |
+| referrerpolicy | `string`                                                              |                      |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| crossorigin    | `string`                                                              |                      |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| integrity      | `string`                                                              |                      |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| nomodule       | `boolean`                                                             | `false`              |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| async          | `boolean`                                                             | `false`              |          | Correlates to the same attribute on a HTML `<script>` element                                |
+| defer          | `boolean`                                                             | `false`              |          | Correlates to the same attribute on a HTML `<script>` element                                |
 
 ##### value
 
@@ -1507,18 +1530,20 @@ assets.
 
 #### options
 
-| option      | type      | default      | required | details                                                                                      |
-| ----------- | --------- | ------------ | -------- | -------------------------------------------------------------------------------------------- |
-| value       | `string`  |              | &check;  | Relative or absolute URL to the CSS asset                                                    |
-| prefix      | `boolean` | `false`      |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
-| crossorigin | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| disabled    | `boolean` | `false`      |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| hreflang    | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| title       | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| media       | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| type        | `string`  | `text/css`   |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| rel         | `string`  | `stylesheet` |          | Correlates to the same attribute on a HTML `<link>` element                                  |
-| as          | `string`  |              |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| option      | type                                                                  | default               | required | details                                                                                      |
+| ----------- | --------------------------------------------------------------------- | --------------------- | -------- | -------------------------------------------------------------------------------------------- |
+| value       | `string`                                                              |                       | &check;  | Relative or absolute URL to the CSS asset                                                    |
+| strategy    | `"beforeInteractive" \| "afterInteractive" \| "lazy" \| "shadow-dom"` | `"beforeInteractive"` |          | Specify how the CSS should be loaded                                                         |
+| scope       | `"content" \| "fallback" \| "all"`                                    | `"all"`               |          | Specify what routes the CSS should apply to                                                  |
+| prefix      | `boolean`                                                             | `false`               |          | Whether the pathname defined on the constructor should be prepend, if relative, to the value |
+| crossorigin | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| disabled    | `boolean`                                                             | `false`               |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| hreflang    | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| title       | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| media       | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| type        | `string`                                                              | `text/css`            |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| rel         | `string`                                                              | `stylesheet`          |          | Correlates to the same attribute on a HTML `<link>` element                                  |
+| as          | `string`                                                              |                       |          | Correlates to the same attribute on a HTML `<link>` element                                  |
 
 ##### value
 
diff --git a/docs/guides/assets.md b/docs/guides/assets.md
index 7cd8166..d5efc49 100644
--- a/docs/guides/assets.md
+++ b/docs/guides/assets.md
@@ -119,11 +119,21 @@ Unique selectors can mitigate some of the isolation problems, but a podlet can s
 
 Using the [shadow DOM](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM) you can isolate a podlet from its surroundings. By wrapping a podlet in a [declarative shadow DOM](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM#declaratively_with_html) you can still get the benefits of server-side rendering.
 
-#### `podlet.css()` can't be used with shadow DOM
+To wrap a podlet in declarative shadow DOM, set the `useShadowDOM` option to `true`.
 
-With `podlet.css()` the end result is a `<link />` tag in the HTML document's `<head />`. If your podlet's content renders inside a shadow DOM that CSS won't be able to reach the podlet.
+Any CSS added must set `strategy: "shadow-dom"` so it can be linked to and apply inside of the shadow DOM.
 
-With a declarative shadow DOM you have to include your own `<link />` to the CSS from inside the shadow DOM.
+```js
+const podlet = new Podlet({
+  name: "my-podlet", // when useShadowDOM is set to true, name must be valid custom element name
+  useShadowDOM: true,
+});
+
+podlet.css({
+  value: "https://cdn.site.com/my-podlet.css",
+  strategy: "shadow-dom",
+});
+```
 
 ### Islands architecture