Ⅰ、前言当我们每次打卡页面，切换路由，甚至于异步组件，都会有一个等待的时间；为了不白屏，提高用户体验，添加一个loading过度动画是非常常见的；那么这几种场景我们应该把loading加在哪里呢？文章目录Ⅰ、前言Ⅱ、vue3常见过度1、首次打开页面时loading2、路由切换时、异步组件loadingⅢ、添加过度动画Ⅱ、vue3常见过度针对以下3种情况做了一下整理👇①首次打开页面时；②路由切换时；③异步组件显示时；1、首次打开页面时loading在页面首次打开的加载内容，是最容易的，通过根目录index.html文件在里添加内容，就是过度内容body>divid="app">h1>加载中...
uniapp云打包后IOS白屏，真机调试也是白屏，没有报错！解决办法！原来用uniapp写的小程序然后要翻成app一开始还是很顺利的，因为安卓端测试没有什么大问题；但是IOS直接白屏，只能看到tabBar百度了各种都没有得到解决，困扰了一天！！然后第二天突然想到会不会是subPackages分包机制的问题，然后看了一下官网：subPackages分包加载配置，此配置为小程序的分包加载机制。因小程序有体积和资源加载限制，各家小程序平台提供了分包方式，优化小程序的下载和启动速度。所谓的主包，即放置默认启动页面/TabBar页面，以及一些所有分包都需用到公共资源/JS脚本；而分包则是根据pages.
uniapp云打包后IOS白屏，真机调试也是白屏，没有报错！解决办法！原来用uniapp写的小程序然后要翻成app一开始还是很顺利的，因为安卓端测试没有什么大问题；但是IOS直接白屏，只能看到tabBar百度了各种都没有得到解决，困扰了一天！！然后第二天突然想到会不会是subPackages分包机制的问题，然后看了一下官网：subPackages分包加载配置，此配置为小程序的分包加载机制。因小程序有体积和资源加载限制，各家小程序平台提供了分包方式，优化小程序的下载和启动速度。所谓的主包，即放置默认启动页面/TabBar页面，以及一些所有分包都需用到公共资源/JS脚本；而分包则是根据pages.
公司业务展示官网开发，构建版本后在测试环境下，发下首屏加载损耗高达几十秒（服务器在国外，所以也导致加载时间变长），于是采用了以下方法来达到提速目的。 1.采用懒加载的方式路由懒加载和组件懒加载：constOne=()=>import("./one");图片懒加载：使用vue-lazyload插件//引入vue懒加载importVueLazyloadfrom'vue-lazyload'//方法一：没有页面加载中的图片和页面图片加载错误的图片显示//Vue.use(VueLazyload)//方法二：显示页面图片加载中的图片和页面图片加载错误的图片//引入图片importloadingfrom'@
公司业务展示官网开发，构建版本后在测试环境下，发下首屏加载损耗高达几十秒（服务器在国外，所以也导致加载时间变长），于是采用了以下方法来达到提速目的。 1.采用懒加载的方式路由懒加载和组件懒加载：constOne=()=>import("./one");图片懒加载：使用vue-lazyload插件//引入vue懒加载importVueLazyloadfrom'vue-lazyload'//方法一：没有页面加载中的图片和页面图片加载错误的图片显示//Vue.use(VueLazyload)//方法二：显示页面图片加载中的图片和页面图片加载错误的图片//引入图片importloadingfrom'@
问题1:在LaunchScreen启动页中设置图片，模拟器运行可以显示，真机运行无法显示。2:在LaunchScreen启动页中设置图片,项目工程内看是有的，但是真机运行无法显示。3:在LaunchScreen启动页中替换旧的图片，我们更新了assets中的资源图片，项目工程内看是变了的，但是真机运行还是显示旧的图片原因由于历史原因，苹果公司提供两种设置启动图片的方式。launchScreen和LaunchImage，iOS8以前的系统不支持launchScreen。launchScreen方式会把启动图缓存到APP的资源包内，每次更新，这一部分资源会检测文件名称，如果名称一致，则不会更新。并
问题1:在LaunchScreen启动页中设置图片，模拟器运行可以显示，真机运行无法显示。2:在LaunchScreen启动页中设置图片,项目工程内看是有的，但是真机运行无法显示。3:在LaunchScreen启动页中替换旧的图片，我们更新了assets中的资源图片，项目工程内看是变了的，但是真机运行还是显示旧的图片原因由于历史原因，苹果公司提供两种设置启动图片的方式。launchScreen和LaunchImage，iOS8以前的系统不支持launchScreen。launchScreen方式会把启动图缓存到APP的资源包内，每次更新，这一部分资源会检测文件名称，如果名称一致，则不会更新。并
体验版小程序-白屏现象今天发布uniapp小程序体验版的新问题是小程序白屏。基本完成了我的小程序，打算上传发布，手机扫描体验版的二维码，点击进入后却一直白屏，什么内容也没有。但不管是真机调试还是预览都没有问题。出现白屏好几次了，第一次是因为没有配置合法域名，因为在开发的时候，项目配置是勾选了不校验合法域名的，但是打包上线测试版本，因为域名不合法，所有出现接口不能用白屏的现象；第二次是体验版小程序进入页面的路径不对，改过来之后，进入体验版不是立马就能行的，因为缓存问题，需要将体验版小程序删除，再次扫码进入，才能够正常显示出现白屏原因：1、小程序后台没有配置合法域名2、体验版小程序进入页面路径不对
体验版小程序-白屏现象今天发布uniapp小程序体验版的新问题是小程序白屏。基本完成了我的小程序，打算上传发布，手机扫描体验版的二维码，点击进入后却一直白屏，什么内容也没有。但不管是真机调试还是预览都没有问题。出现白屏好几次了，第一次是因为没有配置合法域名，因为在开发的时候，项目配置是勾选了不校验合法域名的，但是打包上线测试版本，因为域名不合法，所有出现接口不能用白屏的现象；第二次是体验版小程序进入页面的路径不对，改过来之后，进入体验版不是立马就能行的，因为缓存问题，需要将体验版小程序删除，再次扫码进入，才能够正常显示出现白屏原因：1、小程序后台没有配置合法域名2、体验版小程序进入页面路径不对
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 提升首屏的加载速度，是前端性能优化中最重要的环节，这里笔者梳理出一些常规且有效的首屏优化建议目标：通过对比优化前后的性能变化，来验证方案的有效性，了解并掌握其原理1、路由懒加载SPA项目，一个路由对应一个页面，如果不做处理，项目打包后，会把所有页面打包成一个文件，当用户打开首页时，会一次性加载所有的资源，造成首页加载很慢，降低用户体验列一个实际项目的打包详情：app.js初始体积： 1175KB app.css初始体积： 274KB 将路由全部改成懒加载//通过webpackChunkName设置分割后代码块的名字constHo
