需要掌握的基础原理底层架构 传统的网页，UI渲染和JS脚本同一个线程中执行；小程序基于性能的考虑启用了双线程。视图层：webview线程，负责启用不同的webview来渲染不同的小程序页面。逻辑层：一个单独的线程执行JS代码，控制视图层的逻辑。 启动过程 准备运行环境微信启动双线程环境，在线程中完成小程序基础库的初始化和预执行。 下载、注入并执行对应小程序代码包初次启动时，需要下载编译后的代码包到本地。如果启动了分包”subPackages”,则只下载主包内容。 渲染...
动画、播放器、文件加载过大
解决前端动画卡顿的问题页面卡顿原因：我们设备大多数的肉眼可见不卡顿是 60fps,就要求浏览器对每一帧动画的渲染在 16ms 内完成。优化方案如下： 1.css 优化 尽量使用 transform 属性，避免使用 height、width、margin、padding 等.浏览器的渲染进程里有主线程和合成线程，margin-left:-18px，就要计算 18 次，经历 DOM tree、css tree、render tree、绘制这些阶段，然后合成线程也要计算 18 次，但是使用 t...
常见的js兼容性问题
常见的 js 兼容性问题有哪些 弹框显示时，禁止背景滚动、并且记录滚动距离 1234567891011// ****showDialog时****// 1.设置body的position: fixed;// 2. 记录滚动的距离 window.scrollYQ.$("body").css("top", -window.scrollY + "px");Q.$("body").css("posit...
webpack如何编写一个loader、plugin
webpack 如何编写一个 loader、plugin
xm-work-需求评审
售前限制薅羊毛用户无脑领课背景： 产品说主 App 内用户不需要输入手机号，直接点击 0 元领课按钮，会导致很多无效订单。订单数=》加老师数 直接的转化率 数据就会不准确，数据模型有问题。思考： 输入手机号是可以一定程度上过滤部分无脑下单的用户疑问点： 账户 A 登陆主 App,但是售前 H5 页面会存在登陆 B、C、D 等账户的问题，是否会影响订单和转化率的关系。一个用户用了多个手机号下单，但是只有一个微信加了老师。那么真实订单数 : 加老师的比率就会不准确。产品答复： 这样的用户存在少...
npm install原理
npm i的具体机制 早期的时候 是严格按照package.json的结构，一一对应的在node_modules中按照对应的包，这样造成的问题就是: 嵌套层级可能过深，在Windows系统中，文件路径最大长度为260个字符 重复的安装包 后来npm 3.X版本采用扁平化的结构 安装模块时，不管其是直接依赖还是子依赖的依赖，优先将其安装在node_modules根目录。 当安装到相同模块时，判断已安装的模块版本是否符合新模块的版本范围，如果符合则跳过，不符合则在当前模块的node_mod...
移动端兼容性问题整理
红米Note手机position: fixed;布局定位失效。 设备信息:型号：Redmi Note 8 Pro版本：10 现象如下：fixed定位的元素随着滚动条滚动了；后来排查发现是因为某个元素宽度超出屏幕，导致定位失效了。 解决方案如下:1234*{ -webkit-overflow-scrolling:touch; overflow-x: hidden !important;}*