优化网页 Performance、Progressive、Accessibility、Best Practices 等

[nicejade]

从使用 Lighthouse 给应用跑分情形来看，在 Performance、Progressive、Accessibility、Best Practices 分别得分 48、64、67、88；这需要努力修缮一把。

[nicejade]

PWA, 即：Progressive Web App (渐进式Web应用程序)；它的存在，使得在网络上提供惊人用户体验的新方式，它为构建高质量的渐进式 Web 应用程序，提供了令人难以置信的优势，可以轻松取悦用户，增加参与度并增加转化次数。所以这已经成为了现代化 Web 应用程序必做工作。本应用对 PWA 的支持，选择参考了 vuejs-templates/pwa，其中用到 sw-precache-webpack-plugin 插件协助生成 service-worker.js。但在部署到服务器之后，屡次报有如下错误，令人百思不得其解：

The script has an unsupported MIME type ('text/plain').
Failed to load resource: net::ERR_INSECURE_RESPONSE

即便已经将 service-worker.js 放置在根目录之下，应用也支持 HTTPS 等等 serviceWorker 必须条件，且在 node server 层提供了对应用访问 service-worker.js 支持，但屡次尝试，报错依然存在。

后来仔细看了请求发现，地址栏访问 service-worker.js 虽没有问题；但在访问 https://nicelinks.site/ 时候，所发起对 service-worker.js 的请求，竟是失败的；而在 node server 层肯定是 Okay，猛然醒悟，猜测问题可能出现在 nginx 层；立刻查究 nginx 对应用的配置文件，发现果然是有问题的 ——没有针对 js 文件提供映射，😪。

location ~ \.(htm|html|gif|jpg|jpeg|png|bmp|ico|css|txt)$ {
  root /data/site/nicelinks/public;
  index index.html;
  try_files $uri $uri/ =404;
  expires      7d;
}

果然改为如下这样，重启 nginx ( nginx -s reload ),问题迎刃而解；

location ~ \.(htm|html|gif|jpg|jpeg|png|bmp|ico|css|txt|js)$ {
  root /data/site/nicelinks/public;
  index index.html;
  try_files $uri $uri/ =404;
  expires      7d;
}