elementplus自动导入开发时切换页面慢

elementplus自动导入开发时切换页面慢,第1张

原先是这样的写法,最近写着写着项目页面切换变得越来越卡顿,经过原因排查后,发现是viteconfigjs下方代码导致的
ElementPlusResolver({
importStyle:"sass",
}),
查看网络请求,会发现每次都会请求大量element-plus的样式文件
我觉得原因是这样的:vite会预加载style,当首次启动 vite 服务时会对 style 进行依赖预构建,因为element-plus的按需样式会导入大量style文件,导致页面会卡住直至style构建完成
改成开发环境不使用按需加载样式
ElementPlusResolver({
importStyle: mode === "development" false : "sass",
}),
然后自定义一个插件,mainjs中插入element-plus全部样式
这里只列举viteconfigjs中的修复该问题的代码

测试同学提的一个bug,项目中使用element dialog,写的一个组件,里面一个img标签作展示,根据切换select标签,点击展示不同,结果在测试环境切换后,展示还是第一次展开的

其实主要是before-close里面绑定的方法把之前的值清空一下,就不会存在缓存问题了

在IE下的JS编程中,以下的编程方式都会造成即使关闭IE也无法释放内存的问题,下面分类给出
1、给DOM对象添加的属性是一个对象的引用。
范例
var MyObject = {};
documentgetElementById('myDiv')myProp = MyObject;
解决方法
在windowonunload事件中写上: documentgetElementById('myDiv')myProp = null;
2、DOM对象与JS对象相互引用。
范例:
function Encapsulator(element) {undefined
thiselementReference = element;
elementmyProp = this;
}
new Encapsulator(documentgetElementById('myDiv'));
解决方法:
在onunload事件中写上: documentgetElementById('myDiv')myProp = null;
3、给DOM对象用attachEvent绑定事件。
范例:
function doClick() {}
elementattachEvent("onclick", doClick);
解决方法:
在onunload事件中写上: elementdetachEvent('onclick', doClick);
4、从外到内执行appendChild。这时即使调用removeChild也无法释放。范例
var parentDiv = documentcreateElement("div");
var childDiv = documentcreateElement("div");
documentbodyappendChild(parentDiv);
parentDivappendChild(childDiv);
解决方法:
从内到外执行appendChild:
var parentDiv = documentcreateElement("div");
var childDiv = documentcreateElement("div");
parentDivappendChild(childDiv);
documentbodyappendChild(parentDiv);
5、反复重写同一个属性会造成内存大量占用(但关闭IE后内存会被释放)。
范例:
for(i = 0; i hostElementtext = "asdfasdfasdf";
}
这种方式相当于定义了5000个属性!


DABAN RP主题是一个优秀的主题,极致后台体验,无插件,集成会员系统
乐在赚 » elementplus自动导入开发时切换页面慢

0条评论

发表评论

提供最优质的资源集合

立即查看 了解详情