首页 > 编程语言 >一对一直播源码,路由加载优化白屏

一对一直播源码,路由加载优化白屏

时间:2024-05-25 09:07:30浏览次数:24  
标签:源码 dialog 组件 白屏 路由 加载

一对一直播源码,路由加载优化白屏

目标: 缩小打包体积,优化白屏时间

路由懒加载

const Home = () => import(/* webpackChunkName: "home" */"@/views/home/index.vue");
const MetricGroup = () => import(/* webpackChunkName: "metricGroup" */ "@/views/metricGroup/index.vue"); 
const routes = [
        {
           path: "/",
           name: "home",
           component: Home
        },
        {
           path: "/metricGroup",
           name: "metricGroup",
           component: MetricGroup
        },
      ]

 

组件懒加载

一般只用在需要用户手动操作才调用的组件,如dialog、drawer等,我们期望用户操作后去触发组件的加载

const dialog= () => import(/* webpackChunkName: “dialogInfo” */ ‘@/components/dialog’);
export default:{
name: ‘homeView’,
components: {
dialog
}
}

 

重新打包后,home.js 和 about.js 中没有了弹框组件的代码,该组件被独立打包成 dialog.js,当用户点击按钮时,才会去加载 dialog.js 和 dialog.css

 

使用组件路由懒加载后,该项目的路由页资源进一步减少体积,可以有效提升首次加载时间
以上就是一对一直播源码,路由加载优化白屏, 更多内容欢迎关注之后的文章

 

标签:源码,dialog,组件,白屏,路由,加载
From: https://www.cnblogs.com/yunbaomengnan/p/18211988

相关文章

  • 一对一聊天软件源码,提升系统性能的图片加载方式
    一对一聊天软件源码,提升系统性能的图片加载方式——图片的懒加载原理:由于浏览器会自动对页面中的img标签的src属性发送请求并下载图片,可以通过html5自定义属性data-xxx先暂存src的值,然后在图片出现在屏幕可视区域的时候,再将data-xxx的值重新赋值到img的src......
  • 视频聊天源码,同步、异步示例代码分析
    视频聊天源码,同步、异步示例代码分析同步示例代码:console.log("开始");functionsyncOperation(){console.log("同步操作");}syncOperation();console.log("结束"); 输出结果:开始同步操作结束 在上述代码中,同步操作syncOperation()按照顺序......
  • 酷黑简洁大气体育直播自适应模板赛事直播门户网站源码
    源码名称:酷黑简洁大气体育直播自适应模板赛事直播门户网站源码开发环境:帝国cms7.5安装环境:php+mysql支持PC与手机端同步生成html(多端同步生成插件)带软件采集,可以挂着自动采集发布,无需人工操作!演示地址:http://demo51.52muban.cc/模板特点:1、程序伪静态版本,实时采集更新,......
  • 仿《Q极速体育》NBACBA体育直播吧足球直播综合体育直播源码
    码名称:仿《Q极速体育》NBACBA体育直播吧足球直播综合体育直播源码开发环境:帝国cms7.5空间支持:php+mysql 仿《Q极速体育》NBACBA体育直播吧足球直播综合体育直播源码+自动采集-我爱模板网源码名称:仿《Q极速体育》NBACBA体育直播吧足球直播综合体育直播源码开发环境:帝国......
  • 联网安装与源码安装mysql
    一、卸载mariadb的rpm包1、首先,你需要找出已安装的MariaDB包的具体名称。可以使用以下命令列出所有已安装的MariaDB包:rpm-qa|grepmariadb2、删除命令(安装mysql不一定需要卸载)yum-yremove+【上图的文件名】或者rpm-e--nodeps+【上图的文件名】二、通过yum在线安装M......
  • 【源码翻译之交互式对象包 AIS-AIS_ColoredShape.hxx文件 多颜色交互式对象
    类AIS_ColoredShape形状的呈现具有可自定义的子形状属性。此类可以将topods的子拓扑分别设置不同的颜色然后作为一个整体显示成员类型定义文档◆DataMapOfDrawerCompdtypedefNCollection_IndexedDataMap<Handle<AIS_ColoredDrawer>,TopoDS_Compound,TColStd_MapT......
  • cmakelist 编译源码生成动态静态库并链接到项目
    当我们使用vscode编译c++代码时,需要加入第三方代码,而它没有库时。这时候我们就需要自己写一个Cmakelist编译成库,然后链接到自己的项目上。下面我以qt的qtpropertybrowser类为例,这个类并不在qt的标准库中,若是在qtcreator中使用,需要在pro引入该文件路径(qt安装目录里-\Qt\5......
  • Packet Tracer-HSRP+DHCPv4+VLAN间路由+以太通道综合实验
    实验拓扑:实验内容:VLAN及VLAN间路由的配置,以太通道的配置,STP的根调整,DHCPv4的配置,首跳冗余HSRP的配置。实验最终结果:PC可以自动获取到DHCP-Server分配的IP地址,实现首跳冗余,并能够访问到模拟互联网3.3.3.3。实验要求:    PC1属于VLAN10IP段:192.168.10.0/24PC2......
  • Java韩顺平满汉楼项目,带源码!!!
    文章目录满汉楼1、程序框架图2、前置工作:配置相应文件和创建mhl数据库3、需求说明4、界面设计(1)用户登录(2)二级菜单1、显示餐桌状态2、预定餐桌3、显示所有菜品4、点餐服务5、查看账单6、结账9、退出满汉楼5、具体代码(1)先设计界面(2)进行用户登录判断功能实现第一步:在mysql......
  • 美容美发行业收银系统源码、美业SaaS系统源码
    美业SaaS系统连锁多门店美业收银系统源码多门店管理/会员管理/预约管理/排班管理/商品管理/ 促销活动PC管理后台、手机APP、iPadAPP、微信小程序......