Skip to content

Commit

Permalink
Merge pull request #164 from fxn/patch-1
Browse files Browse the repository at this point in the history
Clarify what Turbo Drive rendering does
  • Loading branch information
jorgemanrubia authored Feb 13, 2024
2 parents f05dfe4 + eb8385b commit 52aa05d
Showing 1 changed file with 2 additions and 2 deletions.
4 changes: 2 additions & 2 deletions _source/handbook/02_drive.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@ Turbo Drive models page navigation as a *visit* to a *location* (URL) with an *a

Visits represent the entire navigation lifecycle from click to render. That includes changing browser history, issuing the network request, restoring a copy of the page from cache, rendering the final response, and updating the scroll position.

During rendering, Turbo Drive replaces the contents of the requesting document's `<body>` with the contents of the response document's `<body>`, merges the contents of their `<head>`s too, and updates the `lang` attribute of the `<html>` as needed. The point of merging instead of replacing the `<head>` elements is that if `<title>` or `<meta>` tags change, say, they will be updated as expected, but if links to assets are the same, they won't be touched and therefore the browser won't process them again.

There are two types of visit: an _application visit_, which has an action of _advance_ or _replace_, and a _restoration visit_, which has an action of _restore_.

## Application Visits
Expand Down Expand Up @@ -75,8 +77,6 @@ Restoration visits cannot be canceled and do not fire `turbo:before-visit`. Turb

## Custom Rendering

Turbo Drive's default rendering replaces the contents of the requesting document's `<body>` element with the contents of the response document's `<body>` element.

Applications can customize the rendering process by adding a document-wide `turbo:before-render` event listener and overriding the `event.detail.render` property.

For example, you could merge the response document's `<body>` element into the requesting document's `<body>` element with [morphdom](https://github.com/patrick-steele-idem/morphdom):
Expand Down

0 comments on commit 52aa05d

Please sign in to comment.