Jhipster, 采用springboot+webflux+react+typescript技术栈。项目部署是采用k8s+helm 部署在GCP上的,所以这个单体项目幕后是跑在pod上的。
项目上线后,发现单页面应用加载速度很慢,如图所示长时间处于加载状态:
仔细分析一下原因,是加载项目的主要js文件main.bcd3fbbf.js,太慢导致的,需要花费10几秒的时间。
于是考虑把js文件放到cdn中提上日程,搜索了一下免费的方案有个cloudflare的不错,搞起来!
注册完cloudflare后,选取它的免费计划。然后添加你的网站,为了证明这个网站是你的,你需要在原先的域名服务商那边把域名服务器改成cloudflare提供给你的两个域名服务器地址。修改完后,稍等一些时间,cloudflare会自动检测,成功后你的网站在cloudflare会处于“活动状态”,如图
好了,这个时候左边菜单应该有个叫“缓存”的菜单,点击它,设置缓存规则。
这里配置的意思是说对于https://www.tianfujixing.com或者https://tianfujixing.com 下面如 main.bcd3fbbf.js 这样的js文件进行缓存。
另外由于js文件head中默认的cache control策略为no cache,如下图
所以我们要在“边缘TTL”里面设置忽略缓存控制标头,如图
这个时候再看标头,就变了
好了,部署这个设置,就生效了。
此时访问https://www.tianfujixing.com/main.html 或 https://tianfujixing.com/main.html,发现速度提高不少!