Filip Rakowski wrote this blog series about optimizing Vue.js application for perfromance. He focuses on code splitting our state management – Vuex modules.
Ability to code split Vuex modules is a powerful tool. The more data-related operations you’re dealing with in your application the more savings you’ll get in terms of bundle size.
This series is based on learnings from Vue Storefront performance optimization process. By using below techniques we were able to cut off size of our initial bundle by 70% and made it load in a blink of an eye.
The author then explains what are the possible ways to register a Vuex module and what are their pros and cons. He also writes about:
- Static Vuex modules
- Dynamic modules
- Properly code-splitted Vuex modules
- Lazy loading Vuex modules
Even though static Vuex modules registration is sufficient for most use cases there are some certain situations when we might want to make use of dynamic registration. Article is accompanied by example code, charts and links to further resources on the topic. Nice!
[Read More]