经排查后发现四处可优化地方✅1.通过refs调用dom并修改样式会导致页面重绘、回流，阻塞页面渲染，应避免✅2.频繁调用windows全局参数占用资源，应避免✅3.使用懒加载组件渲染组件✅4.使用canvas代替虚拟dom去计算字体大小提示：文章用于记录自己对组件的优化内容，供日后参考，也和大家分享我的解决方法，欢迎指正～这个问题的场景是：在鸿蒙系统的webview里运行H5的离线包。

关于“使用Devtools工具调试前端页面”，鸿蒙官网有详细文档，这里自己记录一下我是如何参照文档实现的，按照官网文档行不通可以参考一下提示：我是mac系统，devecostudio版本是5.0.3.502我自己弄的时候还是比较顺利的，没有出奇怪的问题。需要注意的是调试web页面的时候需要先在模拟器里把这个页面打开哈，否则识别不到。

浏览器根据url从服务器下载到html资源后，将会对html的内容至上而下逐行解析后才会呈现给用户，解析过程会有下载资源(css、js、img等)、执行脚本、构建 DOM 树、渲染页面等操作，这其中有很多规则，当代码设计不合理时可能会导致解析过程冗余、页面首屏渲染时间延长、占用不必要的内存等。所以对解析过程有较全面的详细的了解，也是项目架构的基础。

此时，点击绑定该方法外的区域就会触发该方法啦。全局注册指令的话用起来更方便，不用再用原生单独一个个绑定了。