Github Pages 访问速度慢,使用vercel部署静态博客提高访问速度

这篇具有很好参考价值的文章主要介绍了Github Pages 访问速度慢,使用vercel部署静态博客提高访问速度。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

为什么使用 vercel

国内 Github Pages 速度较慢。使用ping工具测试一下发现速度慢道发火。
vercel 速度快且能够自定义域名,能实现和 Github Pages 一样的效果
vercel 官方地址:https://vercel.com/

这是没有接入vercel之前的ping的速度:

github pages 加速,HTML前端,GitHub,github

接入之后的速度:github pages 加速,HTML前端,GitHub,github

 

如何部署

首先注册一个账号,使用github登陆也可以,然后需要验证手机号,注册成功后进入页面,然后点击import仓库,如果没有正常显示你的仓库列表,就点击那个下拉框,然后重新登陆一下就有了:

github pages 加速,HTML前端,GitHub,github

如果导入的项目是打包好的静态页,在 Build and Output Settings 的 override 都勾上,表示不执行它的默认命令。

github pages 加速,HTML前端,GitHub,github

 

点击 deployed 进行部署,如果部署失败可以查看报错信息是不是上一步的某些选项没有覆盖。部署成功后会进入如图所示的界面,点击Visit就可以直接访问自己的网站了:
 

github pages 加速,HTML前端,GitHub,github

如何自定义域名

我是在 godaddy 上买的域名,这是 godaddy 上之前的 dns 设置,解析到 cloudflare 了。

github pages 加速,HTML前端,GitHub,github

 

cloudflare 上的 dns 解析记录。github pages 加速,HTML前端,GitHub,github

 

修改 godaddy 上的域名解析记录到 vercel 的 dns 服务器上然后点击 update 。

github pages 加速,HTML前端,GitHub,github

 

可以看到过一会儿,vercel 上显示域名已经工作正常了。github pages 加速,HTML前端,GitHub,github

 

将 vercel 自己的服务域名强行重定向到自己的域名。

github pages 加速,HTML前端,GitHub,github

 

之后等 DNS 记录更新了再来看看,和 vercel 自己提供的地址速度对比发现差距还是有点大。

github pages 加速,HTML前端,GitHub,github

 

查找了一下资料发现之前 vercel 有过大陆地区访问失败的情况,还有公告。

github pages 加速,HTML前端,GitHub,github

我们按照公告修改一下 A 记录和 cname:

github pages 加速,HTML前端,GitHub,github

先使用一段时间试试效果看看。

腾讯云域名

  • 腾讯云域名地址:https://console.cloud.tencent.com/domain
  • vercel 静态页挂载地址:https://vercel.com/miofly/mio-test-s/5iv959MEYqhTuJ4MV51ZTHBoDkz7
  • 进入到 setting 中可对项目进行一些设置,如项目名称

github pages 加速,HTML前端,GitHub,github

  • 下面演示如何自定义域名,默认情况下部署成功后 vercel 会给你生成一个默认的域名,如果想要修改成自己的域名可将域名名称修改成自己的。
  • 当选择修改成自己的域名名称后,vercel 会检查域名指向的 DNS 对不对,如果不对的话会提示你域名的 DNS 应该如何配置,按照 vercel 提示的 DNS 信息 在自己的域名的 DNS 配置中进行配置,如图

github pages 加速,HTML前端,GitHub,github

配置多个域名

对其他新增的域名选择重定向到自己的主域名即可

github pages 加速,HTML前端,GitHub,github文章来源地址https://www.toymoban.com/news/detail-737813.html

到了这里,关于Github Pages 访问速度慢,使用vercel部署静态博客提高访问速度的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 从零用VitePress搭建博客教程(7) -– 如何用Github Actions自动化部署到Github Pages?

    接上一节: 从零用VitePress搭建博客教程(6) -– 第三方组件库的使用和VitePress搭建组件库文档  我们搭建完成vitePress后,那么接下来就是如何部署到线上服务器,这里使用Github Pages,免得自己购买服务器,当然你也可以自己购买服务器来部署(比如阿里云服务器)。 在部署之

    2024年02月08日
    浏览(69)
  • 如何使用Jekyll在GitHub Pages上搭建网站(个人博客)

    本文很长,建议使用侧边栏进行跳转。 Jekyll 是一个基于 Ruby 语言的,用于搭建静态网站的生成器,主要用于搭建博客网站(官方自己的介绍为:Jekyll is a blog-aware, static site generator in Ruby)。但是虽然是静态网站,但是可以实现一些使用数据库的动态网站的效果和功能,是很不

    2024年02月06日
    浏览(81)
  • Jekyll(一).使用Jekyll+Github Pages搭建自己的博客

    Jekyll 是一个静态站点生成器,内置 GitHub Pages 支持和简化的构建过程。 Jekyll 使用 Markdown 和 HTML 文件,并根据您选择的布局创建完整静态网站。 Jekyll 支持 Markdown 和 Lick,这是一种可在网站上加载动态内容的模板语言。所以在Github Pages上使用Jekyll很合适,其他有关介绍请参考

    2024年02月11日
    浏览(51)
  • 杂货铺 | 使用 Github Pages 和 Hexo 搭建自己的独立博客

    node.js安装,在安装时会自动安装npm。 Git安装,点击此处访问官网,按需下载对应版本,默认安装即可。 检验安装是否成功: Win + R 打开运行窗口,输入 cmd ,输入如下命令,有相应版本信息显示则安装成功。 若不正确可以卸载软件重新安装,此外若安装成功,在桌面右键鼠

    2024年04月27日
    浏览(34)
  • 『GitHub Actions』部署静态博客指南

    之前博主是使用的 Jenkins 实现 vuepress 博客的自动部署与持续交付,但是因为现在迁移服务器到海外,并且服务器配置降低。现在经常出现 服务器的 Jenkins 构建过程中 CPU 占用率过高,导致服务器卡死 然后我想的话既然只是部署 静态博客 ,似乎也没必要使用 Jenkins 这样重量级

    2024年02月08日
    浏览(64)
  • 零基础!手把手教你使用VuePress2 + GitHub Pages免费搭建个人博客网站

    目录 介绍 VuePress2 pnpm 搭建 安装 Node.js 安装 pnpm 安装 VuePress step 1:创建文件夹并进入该目录 ​编辑 step 2:初始化项目 step 3:安装VuePress step 4:在 package.json 中修改 scripts step 5:创建目录和配置文件 step 6:将默认的临时目录和缓存目录添加到 .gitignore 文件中 step 7:启动服务

    2024年03月13日
    浏览(71)
  • OpenAI API访问速度不佳?试试用Vercel来加速!

    众所周知,使用openAI API在国内访问体验并不佳,经常遇到访问较慢或者访问失败的问题。本文着重讲讲怎么解决这个问题,让我们日常开发和使用能够更方便的体验到AI带来的便利 为了帮大家省钱,也为了方便操作,实现这套方案只需要以下这三样东西 一个可使用的OpenAI

    2024年02月15日
    浏览(53)
  • Vercel 部署静态页面教程

    博客链接:https://www.iaesun.com 所有文章都在里面,可以进去查找 vercel 官方地址: Develop. Preview. Ship. For the best frontend teams – Vercel 注册登陆都应该会把,这里建议使用github注册 注册成功后进入页面,点击  Add New -project image.png 然后通过绑定的  github  或者  gitlab  导入需要部

    2024年02月04日
    浏览(83)
  • 建站神器:Hexo+Kaze+Gitee Pages 搭建静态博客网站

    建网站本身是一个很大的工程,涉及前端页面的搭建,网站数据的存储,还要购置服务器资源,甚至是后期的维护,过程相当繁琐。 不过如果仅仅是想搭建个人的网站,写写博客,想要美观,又不想操心太多和写博客无关的事情。那么,Hexo + Kaze + Gitee Pages 的方式就很适合你

    2024年01月19日
    浏览(84)
  • 使用 Github Actions 工作流自动部署 Github Pages

    actions顾名思义就是一堆动作,是一个持续集成服务,持续集成包含了拉代码、运行测试、编译代码、登录远程服务器,发布到第三方服务等等的操作,GitHub将这些操作称为actions。 概念:Workflows, Events, Jobs, Actions, Runners Workflows 工作流 一个 Workflow 由多个 Jobs 组成 Events 定义哪

    2024年02月07日
    浏览(70)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包