前端性能优化–缓存

JS文件放尾部，CSS文件放头部等，这些基本的优化点仍是能够作到，可是有时候遇到网速慢的状况，会出现一段时间的白屏，从用户体验的角度来讲，仍是有提高的空间。 根据移动站点的特性，已经用户对页面的期待看来，用户在刚打开页面的时候能够接受旧的东西。 在加载完js等资源文件时能够更新新的内容。这样，就能够尽量快的展现数据，而更新数据等逻辑能够放到后面处理。 在移动站点的优化时，能够有如下几种方案，利用localstorage来作缓存。

1、实时性要求高的

一、第一次加载数据，渲染，缓存到localstorage。


二、第二次用户访问的时候直接读取缓存，渲染。

三、正常逻辑，拉取数据。这里能够分为两种，拉取后又渲染一次页面，本地存储；不渲染，直接存储，下次渲染。

window._cacheModule = {  
    write: function(key){  
        var ret = this.getCacheData(key);  
        if(!ret) return false;  
        document.write(ret);  
        return true;  
    },  
    getCacheData: function(key){  
        if(!window.localStorage) return false;  
        try{  
            var str = localStorage.getItem(key);  
            var item = JSON.parse(str);  
        }catch(e){  
            item = false;  
        }  
        return item;  
    }  
};  

读缓存

if(_cacheModule){  
    var ret = _cacheModule.write('_forum_my_followed');  
}