零散点总结

• 一句话说明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延时问题。

 

转载于:https://www.cnblogs.com/yuhanao/p/10605420.html