今天，遇到了一个静态图片需要单独拿出来做 CDN 加速的需求，之前的方式是通过 API 接口请求图片路径后再进行渲染。
以前也听说过把图片等文件单独上传的 CDN 服务器，但是并没有实践过，正好了解下。
如下图，在一个网络请求开始到完成后，看到各个资源加载的耗时，这里是使用 CDN 后的耗时，非常之快。
这里，主要想讲讲以下三点：
- 什么是动静分离？
- 动静分离有什么用？
- 怎么用？
一，什么是动静分离
一句话就是：静态不变的资源获取与动态资源分离开。
举例：
- 图片资源无需使用接口，直接访问路径（如存储在七牛云等图片服务器），可以使用 CDN 加速。
- HTML，CSS，JS 等文件亦可分离出系统单独访问。
二，动静分离有什么用
- 提高服务的访问性能和可维护性
- 良好的用户体验，说白了，访问就是快，秒开！（咳咳，某些时候太快并不好）
三，怎么用
- 将静态资源部署在 nginx 上，后台项目部署到应用服务器上，根据一定规则去请求 nginx 上的资源。
- 直接将静态资源全部存放在CDN服务器上，包括 JS，CSS，HTML，图片 等等。（推荐）
- 比如 https://mars-assets.qnssl.com/FspZJF8xgIz24cG8xWeq8Sq3yIKB 这个图片就使用了 CDN 加速。
注意事项：
- 我们使用的是原生接入 RN 来进行应用的开发，图片地址固定后，后端替换图片后图片不会立即刷新。
- 原因：图片有 Http 缓存，可以参考 【 HTTP 缓存机制详解】 。
- 解决方案：在请求的图片 url 后面增加时间戳即可解决，如：http://xxxx/xxx/xxx.png?t= timestrap
- 可能会增加项目开发成本，如各个图片的地址需要出一个详细的文档等。
- 动静分离参考：
- CDN 加速原理：
欢迎关注我的公众号，内有学习资源福利，有问题也可以给我留言噢????：