试图在Divi与Elementor之间做出决定来搭建您的WordPress网站?
Divi和Elementor是两个顶级的拖放式WordPress页面构建器。两者都让您无需任何技术知识即可构建100%自定义网站。除了帮助您构建页面外,它们还支持主题构建和高级动态内容集成。
但是,尽管它们有许多相似之处,但一些重要的差异可能会将您推向一个方向或另一个方向。
在这篇文章中,我们将深入比较Divi与Elementor,以帮助您选择适合您需求的选项。
我们不专注于挑选一个“赢家”。相反,我们将展示许多相同点和不同点,以帮助您选择适合您的工具。为此,我们将在六个关键领域比较Elementor与Divi。
- 性能对比
- 用户界面对比
- 独特功能对比
- 定价对比
- 模板对比
- 技术支持对比
- 应该选择哪一个?
Divi与Elementor:性能对比
任何页面构建器的一个重要考虑因素是性能。也就是说,您创建的设计加载的速度有多快?
为了测试Divi与Elementor的性能,我们使用Divi和Elementor设置了相同的设计,并通过一些速度测试工具运行它们。
为了尽量做到这一点,我们在每个构建器之间使用相同的模块集和每个模块中的相同内容创建了我们的设计。
我们使用的模块是:
- 段落文字
- 按钮
- 计数器
- 基本联系表
- 价格表
- 两件式手风琴
- 客户感言
为了使其成为公平竞争,我们正在测试Divi Builder与Elementor和Elementor Pro的插件版本。我们这样做是为了使用相同的主题 ( Astra ) 来准确比较这些构建器的性能。
Divi测试页面
测试站点1:我们的Divi测试页面
我们的Divi测试页面是用以下资源制作的:
- Divi Builder插件
- Astra主题
- 使用上面的模块使用Divi构建的设计
Elementor测试页面
测试站点2:我们的Elementor测试页面
我们的Elementor测试页面是由:
- 免费的Elementor插件(我们禁用了Elementor的内置样式以支持继承主题样式)
- 元素专业版
- Astra主题
- 使用上面的模块使用Elementor构建的设计
需要注意的一件事是,Divi包含一个内置功能来缩小和组合其CSS和JavaScript,而Elementor则没有。出于这个原因,Divi更擅长限制其开箱即用的HTTP请求。
但是,您可以(并且应该)使用免费插件(例如 Autoptimize )或高级优化插件(例如WP Rocket)轻松地向Elementor添加相同的优化。
因此,我们将运行两组测试:
- 没有额外的性能优化
- 已安装Autoptimize以缩小和组合脚本
使用第二个场景中的数字应该更准确地了解这两种工具在实时、性能优化的WordPress网站上的表现。但是,我们仍然包含未优化的数字,以向您展示当您未实施性能优化时它们的比较情况。
除了我们讨论的内容之外,我们没有对默认的WordPress环境进行任何更改。
我们将使用两个测试工具:
- web.dev:来自Google的使用Lighthouse的工具。它从移动设备进行测试。
- WebPageTest:流行的速度测试工具。我们已将其配置为从桌面设备进行测试。
Divi性能
我们将从Divi本身的结果开始(没有自动优化)。
WebPageTest(没有自动优化):
Divi未添加优化下的WebPageTest结果
web.dev(没有自动优化):
Divi未添加优化下的web.dev结果
这是安装了Autooptimize插件的Divi的结果。
WebPageTest(使用自动优化):
Divi启用Autooptimize插件下的WebPageTest结果
web.dev(使用自动优化):
Divi启用Autooptimize插件下的Divi web.dev结果
Elementor性能
我们还将从Elementor本身的结果开始(无自动优化)。
WebPageTest(没有自动优化):
Elementor未添加优化下的WebPageTest结果
web.dev(没有自动优化):
Elementor未添加优化下的web.dev结果
这是安装了Autooptimize插件的Elementor的结果。
WebPageTest(使用Autooptimize):
Elementor使用Autooptimize插件下的WebPageTest结果
web.dev(使用Autooptimize):
Elementor使用Autooptimize插件下的web.dev结果
性能结论
为了让您更轻松地使用这些数据,这里有两个表格将所有数据放在一起。
没有自动优化: