离职前对项目进行复盘

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、当页面变量太多事，可以部分使用内存消耗更小的shallowRef

4、setTimeout 也要设置id，这样在destroyed时，可以进行销毁；定时器也要在页面销毁时进行清理

5、将大的模版要拆成小的模版。按照许小型原则，一个页面一个组件。

6、使用防抖。在涉及按钮、切换的时候，要使用防抖。

7、进行代码审核，去掉废代码，不需要的代码、将css样子尽可能封装。