关于 ES6:

需要注意 ES6 的一些特性和 API 是需要一个 200k 的 Polyfill 才能得到支持的,特性如 for ... of 循环,generator,API 如 Object.assign 等。我们的做法是放弃这些特性,单独引入对应 API 的 Polyfill 。

关于 Webpack:

Webpack 有一个 Code splitting 功能,墙裂推荐。Webpack 作者自己表示发明新轮子的原因就是因为其他工具没有 Code splitting 。

我们在做包体积优化这个事情的时候,看到有两个可能性:DllPlugin 和 Code splitting。严格来说,这两个方案不是解决同一件事情的,侧重点不一样。

DllPlugin 可以把依赖库和业务代码分开,这样一是能够提升编译效率,二是业务代码修改打出的包很小,每次修改,用户只需重新加载一个很小的业务代码的包。长期来看是非常省流量的做法。

Code splitting 做的事情是异步加载依赖包。有点像 RequireJS 。比如我有个页面有轮播的需求,引入了一个几十k的第三方库,而其他页面都用不到,我就可以使用 Code splitting 的特性,异步加载这个库。这样只有在用户访问特性页面才会加载这个库,否则这个流量就省了。

考虑到我们的上线并不十分频繁,DllPlugin 所带来的流量节省效果并不明显,所以我们优先引入了 Code splitting 方案。

Fetch 及 CORS: CORS 不是一个新技术,但是似乎因为兼容问题,业内用得不多,也可能是我孤陋寡闻。我们使用 CORS 的考虑是:

1: 想用 Fetch 但不想用 Fetch-jsonp 。

2: 需求都是来自移动端。

于是就上了 Fetch + CORS 的方案。这里有一个小小的注意点:当开启 CORS 发出一个非简单请求(not-so-simple request)时,浏览器会发起一次预请求(详见:http://www.ruanyifeng.com/blog/2016/04/cors.html),预请求必须是一个简单请求(simple request),这件事情非常好理解:我在发一个非简单请求之前,需要询问服务器这个非简单请求包含的特殊字段能不能发,那么一定不能在询问的时候就已经带上了这些个特殊字段,否则预请求存在的意义是什么。

还有什么想到了再补充吧。。

总结一下公司项目使用各种较新的前端技术和 Api 的一些经验。的更多相关文章

  1. 我是如何在公司项目中使用ESLint来提升代码质量的

    ESLint:你认识我吗 ESLint是一个语法规则和代码风格的检查工具. 和学习所有编程语言一样,想要入门ESLint,首先要去它的官网看看:https://eslint.org/. ESLint的 ...

  2. svn下copy项目后定位到新资源库,产生不同版本号的方法

    转载于http://blog.csdn.net/u012990533/article/details/44776465 最近这两天,公司要做国际化的开发,本打算要用struts2内置的i18n拦截器做 ...

  3. Git,SVN的优缺点及适合的范围,开源项目?公司项目?

    Git,SVN的优缺点及适合的范围,开源项目?公司项目? 使用git不久,粗浅理解: 1)适用对象不同.Git适用于参与开源项目的开发者.他们由于水平高,更在乎的是效率而不是易用性.Svn则不同,它适 ...

  4. ES6系列之项目中常用的新特性

    ES6系列之项目中常用的新特性 ES6常用特性 平时项目开发中灵活运用ES6+语法可以让开发者减少很多开发时间,提高工作效率.ES6版本提供了很多新的特性,接下来我列举项目中常用的ES6+的特性: l ...

  5. Java进阶(二十六)公司项目开发知识点回顾

    公司项目开发知识点回顾 前言 "拿来主义"在某些时候并不是最佳选择,尤其是当自己遇到问题的时候,毫无头绪. 在一次实验过程中,需要实现数据库的CRUD操作.由于之前项目开发过程中, ...

  6. JQuery复制内容到剪切板-jquery.zclip.js的使用,在公司项目中

    公司项目中有一个复制粘贴的内容,也试图找其他插件但都是浏览器兼容问题,在网上找这个插件挺不错的,FLASH,兼容各个浏览器,测试时要在服务器环境下,点击参考,参考这个网址,或者搜下标题这个插件,性能不 ...

  7. 对于大型公司项目平台选择j2ee的几层认识

    我是一个从野路子上一路走来的程序员,现在主要用.net做方案.选.net不选jave并没有什么特别的原因,只不过是因为我自己从c,java学起,后来被vs这个工具所吸引, 很熟悉这个平台罢了,从业15 ...

  8. 在做公司项目是时,昨天晚上还好的,但是第二天启动tomcat发现tomcat启动了,但是没把项目启动起来

    1.问题:在做公司项目是时,昨天晚上还好的,但是第二天启动tomcat发现tomcat启动了,但是没把项目启动起来 2.问题排除: 1)昨天晚上还好着呢,并且没改动代码,排除代码问题.日志中无报错信息 ...

  9. 基于.NetCore开发博客项目 StarBlog - (16) 一些新功能 (监控/统计/配置/初始化)

    系列文章 基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客? 基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目 基于.NetC ...

随机推荐

  1. PostProcess崩溃

    1.__debugbreak 功能暂停程序执行,打开调试器,进入调试模式. 2.重要参考: https://blog.csdn.net/phenixyf/article/details/4930457 ...

  2. 【原创】uwsgi中多进程+多线程原因以及串行化accept() - thunder_lock说明

    如有不对,请详细指正. 最近再研究uwsgi如何部署python app,看uwsgi的文档,里面有太多的参数,但每个参数的解释太苍白,作为菜鸟的我实在是不懂.想搞清楚uwsgi的工作原因以及里面的一 ...

  3. js检测密码强度

    <script> function AuthPasswd(string) {     if(string.length >=6) {         if(/[a-zA-Z]+/.t ...

  4. gitlab+jenkins环境搭建.md

    gitlab+jenkins自动化部署环境搭建 环境说明 系统 主机 IP 安装软件 CentOS 7 study-1 192.168.100.51 gitlab.git CentOS 7 study ...

  5. openfalcon-0.2 配置

    hbs 配置文件 { "debug": true, "database": "openfalcon:123456@tcp(172.16.230.188 ...

  6. [luogu2680] 运输计划

    题面 ​ 很明显, 由于是求最长路的最小值, 我们可以使用二分求解. 我们二分一个长度\(mid\), 将所有使得\(dis(u, v)\)大于\(mid\)的点对\((u, v)\)找出, 设总共有 ...

  7. TensorFlow Activation Function 1

    部分转自:https://blog.csdn.net/caicaiatnbu/article/details/72745156 激活函数(Activation Function)运行时激活神经网络中某 ...

  8. windows下安装redis并设置自启动

    一.下载windows版本的Redis 去官网找了很久,发现原来在官网上可以下载的windows版本的,现在官网以及没有下载地址,只能在github上下载,官网只提供linux版本的下载 官网下载地址 ...

  9. 蓝桥杯-k倍区间

    http://lx.lanqiao.cn/problem.page?gpid=T444 问题描述 给定一个长度为N的数列,A1, A2, ... AN,如果其中一段连续的子序列Ai, Ai+1, .. ...

  10. openstack self-service 实例 连接外网数据表流程

    我的openstack的架构是最简单的controller-compute架构,在provider基础上创建self-service  self-service的实例上外网的流量走向 登陆实例,pin ...