总结一下公司项目使用各种较新的前端技术和 Api 的一些经验。
关于 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 的一些经验。的更多相关文章
- 我是如何在公司项目中使用ESLint来提升代码质量的
ESLint:你认识我吗 ESLint是一个语法规则和代码风格的检查工具. 和学习所有编程语言一样,想要入门ESLint,首先要去它的官网看看:https://eslint.org/. ESLint的 ...
- svn下copy项目后定位到新资源库,产生不同版本号的方法
转载于http://blog.csdn.net/u012990533/article/details/44776465 最近这两天,公司要做国际化的开发,本打算要用struts2内置的i18n拦截器做 ...
- Git,SVN的优缺点及适合的范围,开源项目?公司项目?
Git,SVN的优缺点及适合的范围,开源项目?公司项目? 使用git不久,粗浅理解: 1)适用对象不同.Git适用于参与开源项目的开发者.他们由于水平高,更在乎的是效率而不是易用性.Svn则不同,它适 ...
- ES6系列之项目中常用的新特性
ES6系列之项目中常用的新特性 ES6常用特性 平时项目开发中灵活运用ES6+语法可以让开发者减少很多开发时间,提高工作效率.ES6版本提供了很多新的特性,接下来我列举项目中常用的ES6+的特性: l ...
- Java进阶(二十六)公司项目开发知识点回顾
公司项目开发知识点回顾 前言 "拿来主义"在某些时候并不是最佳选择,尤其是当自己遇到问题的时候,毫无头绪. 在一次实验过程中,需要实现数据库的CRUD操作.由于之前项目开发过程中, ...
- JQuery复制内容到剪切板-jquery.zclip.js的使用,在公司项目中
公司项目中有一个复制粘贴的内容,也试图找其他插件但都是浏览器兼容问题,在网上找这个插件挺不错的,FLASH,兼容各个浏览器,测试时要在服务器环境下,点击参考,参考这个网址,或者搜下标题这个插件,性能不 ...
- 对于大型公司项目平台选择j2ee的几层认识
我是一个从野路子上一路走来的程序员,现在主要用.net做方案.选.net不选jave并没有什么特别的原因,只不过是因为我自己从c,java学起,后来被vs这个工具所吸引, 很熟悉这个平台罢了,从业15 ...
- 在做公司项目是时,昨天晚上还好的,但是第二天启动tomcat发现tomcat启动了,但是没把项目启动起来
1.问题:在做公司项目是时,昨天晚上还好的,但是第二天启动tomcat发现tomcat启动了,但是没把项目启动起来 2.问题排除: 1)昨天晚上还好着呢,并且没改动代码,排除代码问题.日志中无报错信息 ...
- 基于.NetCore开发博客项目 StarBlog - (16) 一些新功能 (监控/统计/配置/初始化)
系列文章 基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客? 基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目 基于.NetC ...
随机推荐
- JS DateTime 格式化
首先看我们在浏览器接收到的DateTime格式的数据: 如果没有在传输的时候把DateTime转成字符串的话,我们只需要在JS中加一段代码即可转换,代码如下: function ChangeDateF ...
- (1)抽象类 (2)接口 (3)内部类 (4)Object类
1.抽象类(重点)1.1 抽象方法的概念 抽象方法就是指不能具体实现的方法,也就是该方法没有方法体,使用abstract关键字修饰如: public abstract void cry(); 1.2 ...
- September 11th 2017 Week 37th Monday
I believe there is a hero in all of us. 我相信每个人心中都住着一个英雄. For every of us, there are two version with ...
- 【跨域】#001 JSONP原理解析【总结】
一.JSONP 是什么? 1.1 概念 JSONP(JSON with Padding)是资料格式 JSON 的一种“使用模式”,可以让网页从别的网域要资料.由于同源策略,一般来说位于 server1 ...
- java String,StringBuilder和StringBuffer
String:1.java语言中的字符串值属于String类,虽然有其它方法表示字符串(如字符数组),但java一般使用Sting类作为字符串的标准格式,java编译器把字符串值作为String对象. ...
- jQuery 和 YUI (Yahoo User Interface) 各自的优缺点有哪些?具体的使用场景是怎样的?
张经纬,前端工程师 知乎用户.赵勇杰.知乎用户 等人赞同 其实jQuery和YUI的侧重点是不一样的. jQuery专注于DOM的操作,他通过继承的方式给传入的对象增加了新的方法,从而使我们可以通过链 ...
- Java基础知识强化107:DecimalFormat
1. 引入: 如何控制输出数据的精度? >1. 使用Math.round方法 (1)Java如何把一个float(double)四舍五入到小数点后2位,4位,或者其它指定位数 ? 答:比如,如下 ...
- 1059. [ZJOI2007]矩阵游戏【二分图】
Description 小Q是一个非常聪明的孩子,除了国际象棋,他还很喜欢玩一个电脑益智游戏——矩阵游戏.矩阵游戏在一个N *N黑白方阵进行(如同国际象棋一般,只是颜色是随意的).每次可以对该矩阵进行 ...
- C# winform webbrowser如何指定内核为IE11?
1)假设你应用程序的名字为MyApplication.exe 2)运行Regedit,打开注册表,找到 HKEY_LOCAL_MACHINE\SOFTWARE\Wow6432Node\Microsof ...
- 20175209 实验三《敏捷开发与XP实践》实验报告
20175209 实验三<敏捷开发与XP实践>实验报告 一.实验内容 编码标准:在IDEA中使用工具(Code->Reformate Code)把下面代码重新格式化,再研究一下Cod ...