如何提高 Gatsby Cloud 在国内的访问速度?

22 篇文章 0 订阅
18 篇文章 0 订阅

Gatsby Cloud 官网截图

Gatsby Cloud 官网截图

Gatsby Cloud 是什么?

Gatsby Cloud 是 Gatsby 公司针对 GatsbyJS 项目而提供的托管云服务,支持 Git Push 自动部署,因为深度集成了 各大 Headless CMS 像 Contentful,Cosmic,Dato CMS 和极快的速度深受前端开发者喜爱。

提速前后的对比图

左图: 部署在 Gatsby Cloud 的网站测速结果; 右图是提速后的测速结果。颜色代表网站的反馈时间,绿色代表快,越接近红色代表极慢甚至没法访问。左图: 部署在 Gatsby Cloud 的网站测速结果; 右图是提速后的测速结果。颜色代表网站的反馈时间,绿色代表快,越接近红色代表极慢甚至没法访问。

左图: 部署在 Gatsby Cloud 的网站测速结果; 右图是提速后的测速结果。颜色代表网站的反馈时间,绿色代表快,越接近红色代表极慢甚至没法访问。

可以看到 部署在 Gatsby Cloud 的网站 在国内的访问速度很不理想 (左图),大部份地区都是访问极慢的(橙色)。

提速后的结果达到了可用的水平 (右图较多的深绿色省份)

测试项目的源代码

我们选了一个 Gatsby Starter 作为测试对像。用了默认的模板,没有做额外的修改。

如何提高 Gatsby Cloud 在国内的访问速度?

如果你在本地进行 Gatsby 项目构建(打包),你可以把打包后的静态网页存放在国内云服务商的存储空间,如 AWS 中国区 的 S3 或 阿里云的 OSS,基本上能保证网站的访问速度。

部署在存储空间的缺点也非常明显: 初始化配置的比较多,如果要做成能持续部署(Git push自动打包和部署),还需要更多的配置。

如果你不喜欢折腾,想找像 Gatsby Cloud 一样简单的方案,可以把 Gatsby 项目 托管在 21云盒子

托管Gatsby 项目在 21云盒子 的流程

1. 注册成为21云盒子会员

2. 授权 21 云盒子访问你要部署的代码仓库

示例图: 在21云盒子选择要部署的代码仓库

示例图: 在21云盒子选择要部署的代码仓库

3. 配置 构建(打包) 命令 和发布目录

示例图: 配置 Gatsby 构建(打包) 命令 和发布目录

示例图: 配置 Gatsby 构建(打包) 命令 和发布目录

4. 点击 “马上部署”

不用一杯茶的时间,你的网站便完成了打包和部署到线上了。

你可以在 app_id.21yunbox.com 访问你的项目 (app_id 是创建是定义的)。

如果你不确定怎么操作? 直接看操作视频:

 

如何把 Gatsby 部署到服务器? 操作视频

21云盒子还能部署什么?

像后端的应用框架 Python Django 或 PHP Laravel 这种是出了名部署起来比较复杂的,在21云盒子也能让你在 3, 4分钟完成打包上线生成一个唯一的二级域名。

数据库呢? 当然也给你简化了,一键建数据库(附上手视频)

还有什么? 想了解更多? 可以查看帮助文档

原博客: https://www.21yunbox.com/blog/solutions/how-to-speed-up-gatsby-cloud-in-china.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值