网站优化

之前在制作徽章的时候，把工信部、公安备案的图标加到里面去了，这就造成了生成后的svg代码很多，一大坨。主要是图标文件的base64编码比较多，无论是公安备案的svg代码还是icp备案的代码，都是一大坨。

将这两个备案代码贴到网站页脚，网站大小一下子增加了不少，虽然套了CDN和开启了Gzip压缩，但服务器带宽小禁不住这样搞啊。为了测试博客首页有多少字节，特地用工具测了下，看看博客首页文件有多大：

将byte换算成Kilobyte，压缩前是23kb，压缩后是7.2kb，体积不小。对于我这种小带宽的博客，每一个byte甚至每一个bit都要精打细算。

在网上找资料的时候，突然想到：svg代码可以作为图片渲染啊！这一下子，思路就清晰了——把svg代码保存成为svg文件，放到网站文件下。然后用 img 标签插入svg文件并链接到相应的网站！！！

完成相应的前置工作后，插入img图片：

<a href="https://beian.miit.gov.cn/" target="_blank">
<img src="https://jul.cn/beian/icp.svg"  alt="icp备案" style="margin: 0 auto;"/></a>
<a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=42011702000715">
<img src="https://jul.cn/beian/ga.svg" alt="公安备案" style="margin: 3px auto;"/></a>

在几个浏览器里面测试一下，显示效果一样，没有样式不对的地方，哈哈，完美解决。再来看看优化后的首页大小：

压缩前：18155byte，大约17kb左右。压缩后：4558byte，大约4.4kb左右。这一下子就优化出4928byte，开心😃😃😃。特此记录，以备后用。