matomo-org / matomo

Empowering People Ethically with the leading open source alternative to Google Analytics that gives you full control over your data. Matomo lets you easily collect data from websites & apps and visualise this data and extract insights. Privacy is built-in. Liberating Web Analytics. Star us on Github? +1. And we love Pull Requests!
https://matomo.org/
GNU General Public License v3.0
19.92k stars 2.66k forks source link

[Vue] Performance improvement: make getCoreJs/getNonCoreJs load via defer #18982

Open diosmosis opened 2 years ago

diosmosis commented 2 years ago

Refs https://github.com/matomo-org/matomo/issues/18981

One potential improvement to page load time: currently the getCoreJs/getNonCoreJs controller actions are synchronous, meaning page load is blocked until they finish, and they can't be split apart and loaded in parallel because of inline scripts that assume they have already been loaded.

The Vue migration will slowly move more of the code currently in getCoreJs out to chunks that are loaded in parallel, but it won't remove all of it. So it would still be an improvement to get them to load concurrently, and without blocking rendering of the page.

Loading them asynchronously is not currently possible as Matomo allows and uses inline scripts that are not deferred, and which assume the existence of JavaScript libraries and Matomo classes/functions being available. During development of Matomo 5, however, it will be possible to disallow inline scripts that are not deferred, change existing scripts and make these two requests load asynchronously.

This one is trivial once the Vue migration is done. It's just disallowing inline <script> without defer, and changing any remaining inline <script>s to use DOMContentLoaded.

jane-twizel commented 2 years ago

Included based on this being a quick/trival amount of work with the benefit of making the platform faster.