离职前对项目进行复盘
1、小程序中使用echart时如何使包最小在日常开发中如果echart包太大会影响主包的大小所以一般都有以下几种方式进行缩包1、只使用当前图形的echart分包。如只使用雷达图就只下载有雷达图的包2、对现有的包进行压缩3、将echart.min.js放入到分包中防止主包超限。同时预加载优化。{ subPackages: [ { root: subpackages/chart, pages: [pages/report/index] } ], // 预加载优化可选wifi下提前加载图表分包 preloadRule: { pages/index/index: { network: wifi, packages: [chart] } } }4、加上平台判断。如微信系统使用可以用本地的小程序用require(../xxxx/echart.min.js);如果其他平台使用可以直接使用 import * as echarts from echarts。根据平台实际效果选择。2、vite配置说明vite中有常用的defineConfig和loadEnv函数前者是用来进行配置后者是用来获取.env配置的。closeBundle打包完成时触发钩子函数。plugins:自增插件包css:中preprocessorOptions预处理配置可以配置对应的scss货车less。build:drop_console打包时移除console;drop_debugger,打包时移除debugger;format.comments:打包时移除所有的注释。sourcemap压缩打包体积reportCompressedSize:关闭文件计算。3、小程序单一性原则要严格遵守如一段代码太多要进行封装内容太多要拆分组件同时小程序在加载列表时一次性加载不能太多当列表编译超过5000条会导致加载崩溃4、想要根据手机的尺寸进行兼容性加载就要在启动的时候将手机的参数注入到容器中可以通过provide/inject方法进行注入。5、底部的窗口在有些页面使用时不能都用view;有时候还需要使用。在页面设计时一定要对最小尺寸进行页面点检有些设计都是按照大尺寸进行的对小手机的兼容性需要调整设计。6、AI编程时一定要先返回修改方案再进行修改因为有些时候AI的修改会导致页面报错导致你都找不到问题在哪里尤其是本地使用A模式但是修改按照B模式修改。7、接口执行不要使用promise.All同时执行多个接口这样一旦有一个接口报错就会导致整个页面报错在处理接口时一定要做兼容性处理报错处理避免一个接口报错导致整个页面崩溃。8、对老项目一定要只能添加组件进行局部替换不能直接修改组件因为直接修改可能导致不知道多少个用到组件的地方产生不必要的报错。9、小程序页面内存有效不能超过2M,所以在开发时不能学着APP一样设计小程序尤其是将多个页面逻辑放在一个页面容易导致页面崩溃而且不好维护。10.内初溢出如何进行优化。1、列表页面不能无限累积。当页面积累的数据太多也可能导致内存溢出。2、reactive 不要包裹Store.3、当页面变量太多事可以部分使用内存消耗更小的shallowRef4、setTimeout 也要设置id这样在destroyed时可以进行销毁定时器也要在页面销毁时进行清理5、将大的模版要拆成小的模版。按照许小型原则一个页面一个组件。6、使用防抖。在涉及按钮、切换的时候要使用防抖。7、进行代码审核去掉废代码不需要的代码、将css样子尽可能封装。