The docs around lazy loading say the following:
the content is not loaded from src until the frame is visible.
However, I think I must be misunderstanding this code. If I have a turbo-frame inside of a hidden div the request still fires.
Does anyone know the specific criteria used to determine visible vs not? I trying to shift through the source code, but couldn’t find anything.
The lazy loading on turbo frames works the same as on images and iframes, it loads once the user scrolls near the element. So if it’s in a scroll view it would start the request regardless of css.
I suggest using an empty turbo-frame instead of the hidden div and then populating it with content when needed.
<%= link_to "Fill frame data", "/my-path-for-data", data: { turbo_frame: "my-empty-frame" }
<%= turbo_frame_tag "my-empty-frame" %>
When the user clicks the link it will load inside of the frame
Do you happen to know where in the code base that logic lives? When I’ve been testing this out, I have not been able to find any distance (even thousands of pixels below the fold) which delays the loading.