I'm working on a new website and the speedup from using PJAX is tremendous (mostly because the page template is unbelievably heavy). Now, most of the pages need some javascript setup: binding to event handlers, connecting to websockets, authorizing, ...
Of course, just enabling parseJs doesn't cut it, it causes all kinds of trouble. So I was thinking for a way to make my application more PJAX-aware. I think one of the few ways to do it is to have page-specific load() and unload() code. Kind of like this:
pjax.connect({
"container": "pjax-content",
"parseJS": true,
"beforeSend": function(e) {
$(document).trigger('_page_unload');
},
"complete": function(e) {
$(document).trigger('_page_load');
}
});
// in each file
// users.js (included in /users)
$(document).on('_page_load', /* ... */);
$(document).on('_page_unload', /* ... */);
// groups.js (included in /groups)
$(document).on('_page_load', /* ... */);
$(document).on('_page_unload', /* ... */);But this is not satisfactory of course because after a few pages everything will be firing at the same time. If I use one instead of on to make sure they only fire once, then after a few page loads everything will stop to work because no new files are being loaded because of the loaded_scripts cache. So I'm trying to think of some alternate solutions.
How about this: a data-pjax-reload attribute on some scripts tags that means they have to be reloaded? Then we could use the .one() binding and everything would work.
Another solution (which I thought of first when logging this issue) is to pass the current page (e.g.: /users) and the to-be-requested page (e.g.: /groups) to beforeSend, complete et al. That way there could be special events for every page: $(document).on('_page_load_users', /* ... */);
There's possibly a way more elegant solution out there.
I'm working on a new website and the speedup from using PJAX is tremendous (mostly because the page template is unbelievably heavy). Now, most of the pages need some javascript setup: binding to event handlers, connecting to websockets, authorizing, ...
Of course, just enabling
parseJsdoesn't cut it, it causes all kinds of trouble. So I was thinking for a way to make my application more PJAX-aware. I think one of the few ways to do it is to have page-specificload()andunload()code. Kind of like this:But this is not satisfactory of course because after a few pages everything will be firing at the same time. If I use
oneinstead ofonto make sure they only fire once, then after a few page loads everything will stop to work because no new files are being loaded because of theloaded_scriptscache. So I'm trying to think of some alternate solutions.How about this: a
data-pjax-reloadattribute on some scripts tags that means they have to be reloaded? Then we could use the.one()binding and everything would work.Another solution (which I thought of first when logging this issue) is to pass the current page (e.g.:
/users) and the to-be-requested page (e.g.:/groups) tobeforeSend,completeet al. That way there could be special events for every page:$(document).on('_page_load_users', /* ... */);There's possibly a way more elegant solution out there.