女王控的博客

预研

18 篇文章

移动端适配汇总

IOS fix 定位不准 现象 在有输入框的情况下尽量不要用 fixed 定位,用 absolute,否则在 IOS 下会出现很多问题,比如输入法收起时 fixed 定位的元素其实还在未收起的地方,会造成在输入法收起时输入框不能点击 解决方案 当然在用 absolute 的时候,需要注意 body、html 的定位(设置为relative或者不设),放在 body 的下面等等问题 微信下 IOS13 输入法不恢复 现象 在 IOS1… »

轻量级网站构建实践

需求背景 最近在做表单分享的需求,类似于问卷调查,需要在三端(桌面端、移动端、微信端)同时兼容 技术方案 我出的方案:采用原生语法新框架写,考虑到首屏渲染的问题未采用 主管出的方案:采用后端渲染模板的方式,最大化首屏加载速度,但有以下问题: 后端渲染对服务器 CPU 的要求较高 本来打算用 oss 来减少后端渲染,但考虑到表单经常变化,且分享的链接要尽可能的保持不变,这就限制了 oss… »

构建多平台轻量化组件的实践

需求背景 需求背景接上文 记一次组件打包为链接的实践 框架搭建接上文 Webpack脚手架搭建笔记——记一次新项目搭建 组件轻量化 在将客服组件上线后,由于未考虑到加载的组件包的大小,尤其是初始加载的包比较大,即使是压缩过初始加载也有600多k… »

Webpack脚手架搭建笔记——记一次新项目搭建

接上文 Webpack升级优化——记一次产品端升级 最近需要开发一个新产品,此时需要一个新框架来承载新产品的开发,根据前端主管的建议,建议我在他已经开发出的新框架上进行改造,这里记录一下改造的关键点 babel 编译兼容 IE 在 .babelrc 文件里加上标红代码,防止ie某些方法报错 脚本运行颜色 在将 npm script 写成 nodejs 脚本时,脚本颜色是灰色,此时需要加上 参数 webpack 加速构建 在 webpack.base.babel.js 文件中添加 hard… »

Webpack升级优化——记一次产品端升级

接上文 Webpack配置笔记 分包策略 在分支 上启动 脚本,得到分包策略如下: 首屏加载对比 原始首屏加载 升级后加载 分包优化步骤 echarts只提取需要的包 immutable 指向同一份,避免 draft 与 antd 重复打包 分大模块改写法 根据路由来分 这里原来的路由引用模块已经是 形式的了,所以我在 里的 加了如下策略 经实验,可以看到各个页面只加载所需的包 根据组件来分 对其中比较大的组件进行了懒加载处理,react-player/draft… »

0%