Allow pages to say they don't want to be cached

[calvincorreli]

Add a data-no-turbolinks-cache attribute to any tag, and the entire page won't be cached.

This is useful in situations where the page contains elements such as video tags that need to be rendered using video.js, which aren't compatible with being stored in the cache.

You could use data-no-turbolink to prevent links on the page from using turbolinks, but that's not really what we're after.

[smidwap]

Hey @calvincorreli I did a quick test of this with videojs and confirmed the problem. The video will re-initialize just fine if Turbolinks is OFF and you're using the browser's back button. But if Turbolinks is on, the video will freeze if using the back button.

You may be able to fix the problem by re-initializing videos with videojs on page:change. I tried this quickly and found that videojs can't re-initialize a video. But, you could use videojs' dispose() method on page:before-change to clean up the video so it can be re-initialized again on page:change. I tried this but couldn't quite get it to work. But seems like a promising path.

You might try this before adding a data-no-turbolinks-cache feature to Turbolinks.

[calvincorreli]

I've spent quite a bit of time trying to find a workaround without making changes to Turbolinks, including seeing if I could somehow get in and monkeypatch Turbolinks, which I couldn't figure out either.

The problem is that once initialized, especially when using the Flash tech as I do for some platforms, the original video tag is gone.

If you don't do the dispose, then you get javascript errors of type "undefined is not a function". If you do dispose, then when the page comes back from the cache, the original video tag is gone, and the initialization code does nothing.

Video.js has an issue logged for this (videojs/video.js#1516) and have no plans to fix things so it would work with solutions like Turbolinks.

This is my best bet at the moment. I've already implemented this on my production application (https://simplero.com), and it seems to work well.

[smidwap]

What about cloning the video tag before videojs is initialized, then putting the cloned video element into after calling dispose?

So it might work like:

• visit page with video
• page:change: clone video tag and initialize videojs
• click link to another page
• page:before-change: dispose of videojs and put cloned video tag back in the dom
• go back to video page
• page:change: start over, clone video tag, and initialize videojs

It's an idea if your PR doesn't get merged. I'm not a maintainer of Turbolinks, so I can't say whether that will happen.

[WaKeMaTTa]

Let's preserver the same structure as Turbolinks 5.

I recommend to change this to:

return if document.querySelector('[turbolinks-cache-control=no-cache]')? 

tl;dr https://github.com/turbolinks/turbolinks#opting-out-of-caching