ColorWhistle如何进行多个网站的速度优化

凯恩集团的客户有30个网站,涵盖各种酒店、酒吧、餐厅和水疗中心。这些多个网站有一个父网站称为-凯恩集合与超级管理员登录。所有其他子网站可以从这个网站使用超级管理员登录凭据进行管理。

项目详细信息

工业:热情好客

工具使用:WPRocket, GTMetrix

地区:联合王国

技术应用:WordPress CMS Multisite, Twig - PHP模板引擎,木材-主题生成器,ACF

这个团队

项目经理:1人
开发人员:1

项目时间:4个月

客户的需求

由于客户的网站速度较慢——平均加载时间为5.82秒,性能为76%,他们找到我们进行网站速度优化和性能优化。除此之外,他们还提出了一些对网站维护工作的依赖。

客户决定在web开发人员的支持下提高所有30个网站的速度、性能和加载时间。在寻找合作机构时,他们检查了我们ColorWhistle网站在GTMetrix中的速度,并查看了分数,他们找到了我们。

Gmetric

在速度优化之前-检查表

优化实时网站的速度是一个敏感的问题。因此,在ColorWhistle,在进行与速度相关的活动时,我们会遵循一个清单。这将确保我们不会错过任何东西。

1.测试速度

客户为他们的酒店、餐厅、水疗中心等建立了30个网站。在所有这些多个站点中,有一个是父站点-凯恩集合.他们使用超级管理员登录凭证管理这个父网站的其他子网站。

超级管理员是具有专用用户名和密码的管理员类型。它极大地帮助管理多个站点。无需为所有网站创建单独的用户名和密码,您可以从单个用户名访问它们。

我们从客户那里得到了凭据,并对所有网站进行了快速速度测试。下图显示了在执行速度优化技术之前网站的平均GTMetrix等级、性能和加载时间状态。

速度提升前

2.进行备份和截图

在致力于提高速度时,备份是一个至关重要的步骤。对于普通的单个站点,我们使用一体机WP迁移插件,我们尝试使用相同的。

不幸的是,该插件不支持多个网站。所以,我们手动登录了MyAdmin门户网站并备份了所有网站的数据库。

然后登陆每个网站的cPanel,备份网站文件。现有的网站有一个文件管理器,里面有所有的数据库。我们下载了这些文件,并将它们导出到扩展名为“.dev”的新文件管理器中。

除此之外,我们还截图了所有30个网站的所有关键页面。这有助于我们检查和比较前后的状态。我们在本地目录中创建了一个文件夹,并保存了所有具有正确名称的截图。

3.创建演示版本

由于这是快速实现,我们不能在活动站点上工作,也不能在维护模式下推迟站点。那么,我们做了什么?我们构建了一个演示环境并克隆了所有的网站。

我们保留了‘/dev’的url。我们确保所有网站和页面都遵循同样的原则。此外,确认所有的演示网站工作类似于当前网站没有任何遗漏。

为了避免没有适当扩展名的url被算作活跃站点的严重问题,我们使用更好的搜索替换插件。

4.升级WordPress和插件

过时的版本也会使网站变慢。在演示和现场站点上,我们发现WordPress和插件的版本都过时了。我们在现场和演示站点上都更新了最新版本。

在更新插件之后,我们检查了它是否运行良好或是否遇到了任何问题。为此,我们做了一些表单提交测试,并检查电子邮件是否正确发送。在演示版本和现场版本中,一切都运行正常。

我们做了什么?

手动速度优化工作

1.优化图像

平均而言,网站图库中图片的最佳大小可以在200KB以下,因为当图片大小较高时,会对网站加载时间产生很大影响。由于我们的客户是一个酒店项目,网站上的图片太多了。

我们已经熟悉了一个图像优化插件,叫做smu.在我们之前的项目中,在激活它之后,我们看到了积极的结果,所以选择了同样的方法。

在不损害质量的情况下,插件有助于压缩图像的高度和宽度。此外,这个插件是启用延迟加载的一个很好的选项。当延迟加载被激活时,文本内容加载很快。稍后,加载图像。当文本加载时,网站将加载正确,它不会等待图像加载。

所以,我们决定添加新的WordPress插件专门用于图像优化。

2.优化数据库

如果一个网站需要快速加载,那么它的数据库也必须进行优化。表单提交、用户详细信息、表格、字段以及网站上的每一个大小细节都将存储在数据库中。

我们对数据库进行了彻底的审计,删除了所有不需要的表单提交、表、字段等。为此,我们安装了一个名为WPOptimize.只需在插件设置中点击几下,我们就能在几分钟内优化数据库。

3.清理缓存

缓存是一个严重影响网站性能的主要问题。为了清除所有缓存,我们正在为多个站点寻找一个理想的插件解决方案。我们之前的经验帮助我们选择了正确的插件,也就是,AutoOptimize

4.禁用不需要的脚本和CSS文件

不需要的CSS文件和Java脚本是什么,例如,如果“请求报价表单”被添加到“联系我们”页面。为了使表单工作,将添加某些编码脚本。相同的脚本将在包括主页在内的所有页面上复制。这在任何方面都是不必要的,反而会降低站点的性能。

另一方面,手动禁用代码部分将是乏味的,所以我们提出了一个替代插件选项。WordPress插件资产清理帮助我们摆脱所有不需要的脚本和CSS文件。

5.移除不必要的插件

任何困难的任务都可以通过安装插件来完成。由于插件可以满足不同的目的,web开发人员通常会下载大量的插件。同时,更多的插件也会破坏网站的性能。

当我们对所有网站进行全面审计时,我们发现某些插件是毫无目的的。因此,我们从列表中删除了未使用的插件。

6.实现HTTP2

在更新HTTP2后,启用它可以使网站加载更快。由于客户专门找我们进行速度优化,我们计划为所有30个网站激活HTTP2。

为此,我们登录到中心站点的相应cPanel中,并启用HTTP2 Server Push机制。以前,客户端使用HTTP扩展。

手机反应

当我们处理与速度相关的任务时,我们发现一些站点面临响应性问题。为了解决这些问题,我们学习了树枝模板引擎,并在移动视图和固定视图中重新访问了设计的样式和布局。我们为移动响应做了什么?

  • 优化了移动视图的切换菜单
  • 改变了背景颜色与文本的对比

服务器优化

通常,当服务器加载了更多的文件和数据时,它会使网站加载变慢。我们检查客户的网站服务器有更多的文件,所以计划删除不需要的文件。结果,我们能够从服务器中删除108 GB的数据。

修复Bug

当我们评估网站时,我们发现了一些bug并修复了它们。

  • cookie的弹出窗口应该只出现一次,当用户点击“接受”时,它不应该再次弹出。但在这里,即使点击“接受”,弹出窗口显示。我们通过添加基于cookie的弹出功能修复了这个错误。
  • 在Timber主题中,当发出某些请求时,不同的功能都可以工作。我们解决了
  • 由于CDN被禁用,Revolution Slider不能正常工作。所以,我们启用了CDN
  • 两个表单不能在一个页面上工作,因此删除了表单并添加了一个按钮。当用户单击按钮时,它将触发对标题书now表单的请求

手动速度优化-结果

在手动优化了所有30个网站的速度后,有几个网站的速度有了预期的提高,但不幸的是,很少有网站的加载速度比以前慢。

速度提高后

为了解决这个问题,我们安装了WPRocket插件。因此,我们能够看到改进。

这是一个付费插件。最初,客户还没有准备好支付这个价格。当我们向他们解释它的好处时,他们被说服了。

WPRocket是最适合速度优化的插件。这一个可以取代所有其他插件,因为它可以自己处理所有与速度相关的任务。

我们将新的WordPress插件添加到父网站。它自动被安装在所有其他的子网站。但是,我们面临的问题是,当我们在父站点上配置一个设置选项时,它没有反映到其他站点上。

我们必须为所有站点手动配置。这是我们面临的唯一问题,但我们仍然做到了。我们根据需要配置了设置。我们删除了之前安装的其他不必要的插件。

最终结果

在完成质量检查后,我们测量了所有30个网站的速度。And, the client was happy with the improvement. This was the overall GTMetrix performance rate and load time.

结束
  • 绩效从76%提高到84%
  • 加载时间从5.82秒降低到2.50秒
  • 整体绩效提升8%
  • 在总体加载时间内获得43%的增强率

ColorWhistle,我们对网站速度优化工作有深入的了解和经验。所以,做这个项目对我们来说似乎并没有太大的压力。但对我们来说新颖的是,多个站点都有SuperAdmin面板。

对我们的团队来说,这又是一次愉快的学习经历。

Pavithra撒母耳
关于作者-帕维特拉·塞缪尔

我是ColorWhistle的一名文字狂热撰稿人,与数字营销有着特殊的联系。我总是喜欢写独特而有创意的内容。为此,我的研究和一贯的阅读习惯给了我很大的支持。我总是寻找独特的灵感,并把它们都写下来,用在我的博客和内容中。而且,很少有内容写作工具可以作为我的主要支柱。除了阅读和写作,我最爱的两个朋友是食物和音乐。我经常发布博客和文章。要获得定期更新,请继续关注我们!

准备开始了吗?

让我们来创作你的下一个数字故事

我们的专业认证- ColorWhistle
转到顶部
关闭弹出

大家一起说

    当然可以,请留下您的详细信息,我们的代表将很高兴给您回电!

    例:无名氏

    例:美国

    更多细节,加速这个过程:)

    Baidu
    map