nuxt解决首屏加载慢问题

项目慢慢大起来之后，页面越来越多你会发现第一次进入vue项目变得很慢，这就叫首屏加载慢。

一般有这些常见原因：

有些项目图片很大也没有压缩 一般大图控制在300k以内小图可以控制到50k以内可以让美术压缩好素材再发给你
项目使用了一些插件 如轮播倒计时等等
其他文件 还有些图标，字体文件等
代码写的有问题 需要优化代码
首页接口过慢 F12 查看Network接口响应速度要求后端优化接口
项目过大页面太多 使用路由懒加载
ssr服务端渲染 渲染过程放到了服务器直接返回html 加快首屏速度

这里推荐两个方法：

1.把一些插件、图片、文件放到cdn里面加速，然后在项目里面使用cdn在线链接。

2.使用路由懒加载

以前的路由文件是在顶部一次性全部import所有文件。

import

如果页面多在顶部一次性全部加载，那页面第一次加载就会慢。

使用懒加载

Vue

在顶部不用引入了，然后在各个路由里面使用import()按需加载，这样只有使用对应路由的时候才会加载对应页面，这不就解决了全部一起加载慢的问题了吗？

这就是懒加载或者说按需加载。

nuxt解决首屏加载慢问题_Vue首屏加载慢相关推荐

vue首屏加载速度慢_Vue首屏加载速度优化如何提升80%？本文详解
在Vue项目中,引入到工程中的所有js.css文件,编译时都会被打包进vendor.js,浏览器在加载该文件之后才能开始显示首屏.若是引入的库众多,那么vendor.js文件体积将会相当的大,影响首屏 ...
解决：电脑屏幕每隔几分钟就闪一次（瞬间黑屏一次），鼠标指针伴随着加载的状态（漏斗或者转圈），然后瞬间恢复正常
解决:电脑屏幕每隔几分钟就闪一次(瞬间黑屏一次),鼠标指针伴随着加载的状态(漏斗或者转圈),然后瞬间恢复正常这个问题出现了很久,一直没找到解决办法,直到实在是忍受不了. 在电脑又一次闪屏后,我立即打 ...
vue2首屏性能优化(splitChunks/externals/gzip/路由懒加载)
首屏加载慢原因: Vue只有第一次会加载页面, 以后的每次页面切换,只需要进行组件替换.因为Vue 是SPA,所以首页第一次加载时会把所有的组件以及组件相关的资源全都加载了,造成网站首页打开速度变慢的 ...
ueditor上传图片回调_（常见解决方法）UEditor报错“后端配置项没有正常加载，上传插件不能正常使用”...
(常见解决方法)UEditor报错"后端配置项没有正常加载,上传插件不能正常使用"_向来萧瑟也无畏-CSDN博客blog.csdn.net 报错信息详见此文的"排错过 ...
hp laser103 属性没有配置项_（常见解决方法）UEditor报错“后端配置项没有正常加载，上传插件不能正常使用”...
(常见解决方法)UEditor报错"后端配置项没有正常加载,上传插件不能正常使用"_向来萧瑟也无畏-CSDN博客blog.csdn.net 报错信息详见此文的"排错过 ...
解决eclipse环境下maven项目tomcat启动，未加载到项目的问题
解决eclipse环境下maven项目tomcat启动,未加载到项目的问题参考文章: (1)解决eclipse环境下maven项目tomcat启动,未加载到项目的问题 (2)https://www. ...
解决父类加载iframe，src参数过大导致加载失败
原文:解决父类加载iframe,src参数过大导致加载失败 <iframe src="*******.do?param=****" id="leftFrame&qu ...
解决Ubuntu自动更新Linux内核导致显卡驱动无法加载,致使循环在登录界面
解决Ubuntu自动更新Linux内核导致显卡驱动无法加载,致使循环在登录界面关闭unattended-upgrade 在/etc/apt/apt.conf.d目录下,查找包含Unattended- ...
android webview加载闪屏,Android Webview：加载url时出现闪屏
我是Android应用程序中的新手,这是我的第一个应用程序. 我已经创建了启动画面和工程..但其后走了一个长长的白色空白屏幕约2-5秒,然后URL开始加载..Android Webview:加载url ...

nuxt解决首屏加载慢问题_Vue首屏加载慢

1.把一些插件、图片、文件放到cdn里面加速，然后在项目里面使用cdn在线链接。

2.使用路由懒加载

nuxt解决首屏加载慢问题_Vue首屏加载慢相关推荐

最新文章

热门文章