待归档


  • title: 前端性能- 请求数据篇
    date: 2017-11-01

    请求数量

    1. 现在的一个页面一般占用的请求有40~50个,页图片请求占有很大的比重,如果页面的请求在第一次初始化后被大面积的并发发出,会造成请求被挤占
    • 在http 1.1协议里,一个域名最多的并发请求为6,后面的请求都会被放到待发队列,导致图片加载延时,所以图片数量要进行懒加载控制
    • 在http2下,往一个域名上发多个请求要没有数量的限制,但因为h2是tcp的单通道,如果并发请求数多,也会造成请求的加载时间,首字节返回时间慢。所以我们计划把原来收敛到单个域名的优化,放开到三个域名。
      页面上初使化时需要对页面上的图片数量控

  • title: 实现 Excel 纯前端复制粘贴
    date: 2017-10-27

    背景

    后台系统中经常存在通过上传 Excel 导入数据的功能需求。

    但运营方在使用该功能时经常会遇到这些问题:

    1. Excel 文件需要修改至符合系统要求;
    2. 上传时可能需要进入较深的文件路径定位文件;
    3. 数据过多时需长时间等待系统响应,甚至很可能上传失败;
    4. 发现 Excel 中存在错误,修改重传时又可能循环上述问题。

    换思路,若直接通过 Ctrl + CCtrl + V 复制粘贴 Excel 中的数据到页面中,上述问题似乎都能解决。

    试试实际效果: 戳我

    具体项目代码: 戳我

    准备工作

    1. 剪贴板操作

    总共


  • title: 前端性能 - 请求拦截篇
    date: 2017-11-01

    性能是老生常谈的话题
    css在前,js在后,放到cdn,设e-tag, 设gzip等在实际网页基础设置中需要做的原则。
    在业务层面上,如何优化网页。
    常碰到的问题是:

    1. h5页面在app上崩溃了。
    2. h5页面出来很慢
    3. h5在不同的机子上样式乱了
    4. h5出了线上bug了

    怎么都是在h5上出了问题呢,而且很多是在app的环境里出了问题。拿到这样的问题需要怎么处理呢,目前我们没有很好的h5在app上的调试工具,我用到的是charles进行定位和调试。

    请求拦截

    1.获取页面的工具页面的url,因为在app里,所以第一步是获取页




  • title:  初识Egg
    date: 2017-12-13

    简介

    Egg:为企业级 node 框架和应用而生

    Egg 推崇约定大于配置,可以认为它是”框架的框架”,我们可以基于 Egg 开发出一套适应自身业务场景的上层框架,而这一切都得益于 Egg 高度灵活的插件机制,以及渐进式开发的模式

    渐进式开发

    渐进式开发的过程也就是框架演进的过程

    也就是说,如果你想自己定制一个适应于自身业务的 Egg 上层框架,一开始可能是无框架的,每个 Egg 工程中各自的插件都是定制、差异化的体现,当最终证明某个插件是符合当前业务的最佳实践时,才向下沉淀为框架的一部分

    以封装上层框架的形式沉淀出一套适应于业务

  • 探讨可用于实践的前后端分离方案

    Topic

    探讨可用于实践的前后端分离方案

    Background?

    业务发展过程中,技术团队已不再是原来的一人全包或是每个人啥活都干了,更看重每个人术业有专攻。那么,前后端开发如何减少耦合,各自独立地开展工作,是我们值得深层次的思考的问题。

    Problems

    1. 环境:进行本地开发,需要起后端环境,如 Tomcat、PHP,影响开发效率
    2. 流程:前端开发先开发 html,再将 html 改写成指定的模板语法(俗称套模板),影响开发效率
    3. 接口:
      • 接口定义一般使用 word 文档,前端开发时不好理解接口字段,影响开发效率
      • 接口变更需要重新编写文档,并重新发送,影响开发