zoukankan      html  css  js  c++  java
  • 善用js 异步引入,大幅提升vue站点加载速度,媲美大厂流畅性

    相信很多同学都会遇见这样一个问题,vue,开发的网页一直转圈,Vue不好吗,不是,一个小知识点让你的Vue网页如丝滑般流畅

    我在学vue的第一节课,也就是入门课时,就被老师教导分模块,分组件,接下来看下模块与组件如何优化吧

    首先从全局来看,多个网页的路由文件使用路由懒加载,这样:

    {
          path: 'index',
          name: 'index',
          meta: {
            title: '首页信息',
          },
          component: () => import('@/views/home'),   //()=> 后面不加大括号,Es6直接返回后面的内容,这就是路由懒加载
        }
    

      从构成一个网站的页面中的单个页面来看,可以这样

    const home=()=>import('@/components/home');  //vue组件懒加载,不要小看哦,加载时采用这种方式引入,可以大幅提升页面加载速度哦

    export default{
      components:{
      home
    }
    }

     各位同学要善用组件,善于拆分并异步引入,相信你们的网站也会超级流畅 

  • 相关阅读:
    使用babel插件集
    使用babel
    webpack基本配置
    vue-router参数传递
    路由(二) router-link的使用
    路由使用(一)
    获取DOM
    父组件传递值给子组件(一)
    定义全局组件
    Windows下更改MySQL数据库的存储位置
  • 原文地址:https://www.cnblogs.com/uimeigui/p/12655391.html
Copyright © 2011-2022 走看看