零散点总结

• 一句话说明rem和em的区别

二者都是转化到px, 区别在于rem是根据根元素的字体大小去转化（ 此字体大小会被浏览器中字体大小的设置影响，除非显式重写一个具体单位），如html元素设为16px,  css设置10rem就是160px; em是根据使用em的元素的字体大小(此字体大小受从父元素继承过来的字体大小，除非显式重写与一个具体单位)， 如为16px, 10em就是160px。

 

• 快速删除node_modules

手动删除一般会遇到文件名过长的状况，一层一层的将文件名改短虽可行确毫无效率。根据官方提供的方法, 只需两步，终身无忧：

npm install rimraf -g

rimraf node_modules

• 最简单的数组去重方法

function merge(arr) {
    if(!Array.isArray(arr) | arr.length == 0) {
        return []
    }

     var res = [];
     for(var i=0;i<arr.length;i++) {
           if(res.indexOf(arr[i]) == -1){
                res.push(arr[i])
           } 
     }

     return res;
}

• ES6数组去重方法

     [...new Set([2,2,2,4,5,4])]   // [2,4,5]

 

• 异步加载方式： async, defer, 动态脚本建立

     defer是在HTML解析完以后才会执行，若是是多个，按照加载的顺序依次执行

     async是在加载完以后当即执行，若是是多个，执行顺序和加载顺序无关

 

• 大型web应用对速度的追求并无止步于仅仅利用浏览器的缓存，由于浏览器缓存始终只是为了提高二次访问的速度，对于首次访问的加速，咱们须要从网络层面进行优化，最多见的手段就是CDN(Content delivery Network)内容分发网络加速。经过将静态资源（如js css 图片等）缓存到离用户很近的相同网络运营商的CDN节点上，不但能提高用户的访问速度，还能节省服务器的宽带消耗，下降负载。

 

• 移动端引入fastclick后, 只要双击 chrome就报错 
• 这是由于Chrome及其内核浏览器更新了一项新特性，原先只会报黄色等级的错误，如今升到红色了，为了流畅度 。click事件在移动端有个300ms延时，就是由于避免和手机双击行为发生冲突。能够经过设置 touch-action:manipulation（表示浏览器只容许进行滚动和持续缩放操做，相似双击缩放这种非标准操做就不能够）拒绝双击行为，则显然，300ms延时就不复存在，所以，html {touch-action: manipulation;}声明能够用来避免浏览器300ms延时问题。