Hotwire Gap

Eager loaded frames

Frames with an src value will load their content from a remote source. The fetch request begins as soon as the eager frame appears on the page. No custom javascript is required to initiate the fetch.

<html>
<head></head>
<body>

Here'd we'd have our content that needs to load immediately with the request and is not appropriate for remote fetching. Then we could use eager frames to fetch content that isn't a necessity for the initial page load. For example:

<%= turbo_frame_tag "first eager frame to load", src: books_path >
<%= turbo_frame_tag "second eager frame to load", src: url >
Let's see it in action!
</body>
</html>