Jan 9 in Vue.JS


What are Async components?

1 Answer

Jan 9

When a large application uses a lot of components, it may not make sense to load up all components at the same time from the server. In such a case, Vue allows us to define components that are loaded from the server asynchronously, as and when needed. When declaring or registering components, Vue accepts a factory function that offers a Promise. The component can then be ‘resolved’ when called. 

This saves bandwidth and application bootstrap time by loading only the essentials and deferring async components to their invocation time in the future.

Here’s a simple example of how a component can be made asynchronous. 

new Vue({
    components: {
        ‘tweet-box’: () => import(‘./components/async/TweetBox’)

When used this way, Webpack’s code splitting feature is employed to deliver this functionality.

<!--[if !supportLists]-->·         <!--[endif]--> 


Click here to read more about Vue JS
Click here to read more about Insurance

Related questions

May 30
Oct 1, 2019 in Vue.JS
Jul 2, 2019 in React JS