Divi 和 Elementor 是两个顶级的拖放式 WordPress 页面构建器。两者都可以让用户构建100%的自定义网站，而无需任何技术知识，除了构建页面外，它们还支持主题构建和高级动态内容集成。
尽管它们有许多相似之处，但一些重要的差异是用户选择出适合自己的页面构建器的重要影响因素。接下来将深入比较 Divi 与 Elementor，以帮助商家选择适合自己需求的正确选项。
文章目录
Divi和Elementor对比一：性能测试
为了让大家更加直观的了解到Divi和Elementor页面构建器插件的性能区别，这一部分为大家分享来自 PageSpeed Insights 和 GTmetrix 的测试结果，以供大家参考。
1、测试准备本文构建了两个具有相似元素和模块的测试站点。一个使用Elementor构建，另一个使用Divi构建，Divi和Elementor都包含有：
- 带有487 KB图像（.png）的hero标头
- 一个按钮
- 三个服务使用图标框（具有相同的文本和图标）
- 一个数字计数器
- 1个常见问题解答
- 定价表（有两种方案可供选择）
- 选择的主题：Twenty Twenty Three（原生WordPress主题）
- Divi页面生成器（V.4.24.2）/Elementor Pro（版本V 3.21.1）
（1）PageSpeed Insights
在 Google PageSpeed Insights 上，Divi和Elementor页面构建器插件的移动性能均为橙色，Elementor （74/100） 略优于 Divi （64/100）。
Elementor 测试：
Divi 的结果：
Elementor 的 PageSpeed Insights 改进部分：
- 消除阻止渲染的资源：要消除阻碍渲染的资源，应该同时优化 JavaScript 和 CSS。对于 JS 优化，应该延迟 JS 执行，直到用户交互。
- 减少未使用的 CSS ：CSS 优化涉及从页面中识别和删除任何不必要的 CSS 代码。
- 缩短初始服务器响应时间：此优化旨在减少 HTTP 请求的数量，从而缩短服务器响应时间，可以通过 CSS 和 JavaScript 优化来实现。
- 使用高效的缓存策略提供静态资产：应该缓存内容以改善页面加载时间和用户体验。
- 以下一代格式提供图像：确保图像已转换为 WebP 或 AVIF。
Divi 的 PageSpeed Insights 改进部分
Divi PageSpeed Insights 改进部分类似于 Elementor，有缺少缓存，未使用的 CSS 过多，图像需要优化，此外JavaScript 文件也需要一些优化。
（2）GTmetrix
下面来检查每个页面构建器插件的完全加载时间、页面大小和请求数量。
对于 Elementor：
- 满载时间： 2.9 s
- 文件大小： 940 KB
- HTTP 请求数：15
对于Divi主题：
- 满载时间： 2.9 s
- 文件大小： 874 KB
- HTTP 请求数：36
总的来说，Elementor完全加载时间为 2.7 秒，比 Divi 的加载时间为 2.9 秒略快，这两个构建器的速度相似，因此都非常适合外贸商家要求的性能需求。
关于整体移动分数，Elementor 以 74/100 的分数获胜，而 Divi 的分数为 64/100。
关于 Core Web Vitals，Elementor 的性能略好于 Divi。Divi 的 CLS 是橙色的，而 Elementor 的 CLS 是绿色的，但是Divi 的最大内容绘制 （LCP） 是 Elementor 的 5.8 秒和 5.4 秒，它们都处于红色。
Elementor 的页面大小更大（940 KB，而 Elementor 为 874 KB），但触发的 HTTP 请求比 Divi 少（15 对 36）。
Divi和Elementor对比二：定价区别Divi 主题为用户提供两种定价计划。第一个是每月 23.08 美元的月度计划，另一个要求用户一次性支付 297 美元的费用，并终生享受使用 Elegant 主题的服务。
访问官网：点击进入
推荐阅读：《Divi主题价格是多少》
这两个计划都允许订阅者不仅可以获得 Divi 页面构建器，还可以完全访问他们的整个产品系列。
Divi页面构建器插件定价计划的最大优点是它允许在无限的网站上使用插件和主题，因此用户可以自由部署。最重要的是，提供无条件的 30 天退款保证，因此可以无风险地购买。
相关教程：
Elementor提供免费版本来平衡差异，虽然Elementor页面构建器价格看起来比Divi便宜，但是它的方案配置却不如Divi，但考虑到它提供的性能，这在某种程度上也是合理的。
访问官网：点击进入
相关教程：
Divi和Elementor对比三：可视化界面Divi 提供了一个没有任何固定界面元素的全角编辑器，其元素显示在页面布局的右侧。使用 Divi只需选择要添加的元素并将其拖动到页面的所需位置即可。
Elementor 在左侧栏中提供设计元素，可以选择想要的元素并将它们拖放到页面的任何部分，这非常方便，因为固定侧边栏提供了受控的编辑体验。
与 Divi 一样，Elementor 允许用户执行可视化编辑，显示他们对页面设计所做的即时更改。总的来说，Elementor 的可视化界面相当不错，但不如 Divi 的可视化界面方便。
Divi和Elementor对比四：捆绑主题由于 Divi 带有自己的主题，一些开发人员专门为 Divi 构建器制作了一些主题。
Elementor 通常与 The7 和 BeTheme 等主题捆绑在一起，扩展了其功能。Envato 还有一个专用的“Elementor”过滤器，用于第三方附加组件、主题和模板工具包。
推荐阅读：《Elementor主题哪个好用？Elementor主题模板推荐》
Divi和Elementor对比五：板块部分Elementor使用三种类型的元素：
- Sections （部分）：这些是最大的组，以在部分内包含列和小组件。
- Columns （列）：这些可垂直划分页面，可以使用拖放来调整列的大小。
- 小部件：这些是将使用的实际设计元素，例如文本或按钮。
Elementor 的免费版本包括 32 个基本小部件来构建设计，使用 Elementor Pro，可以获得 68 个小部件。还有第三方 Elementor 插件将提供额外的小部件。
以下是完整列表：
Divi Builder 提供三种不同的构建块，尽管名称不同：
- Section （部分）：最大的板块。
- Row （行）：行可以放在部分内，并使用不同的列布局垂直划分页面。无法通过拖放调整列的大小，但可以使用CSS指定自定义宽度或使用预构建的列布局。
- Modules （模块）：实际的设计元素。
Divi 提供拆分测试选项，这是 Divi 构建器中独有的 A/B 测试功能，它允许对页面中的任何元素进行拆分测试。
Divi Builder 没有免费版本，所以有一组 48 个模块，与Elementor一样，还可以为找到第三方插件。
总而言之，Divi是一个更实惠的页面构建器，但 Elementor 的用户友好性和性能无与伦比。
相关教程：
(本文由美国主机侦探原创，转载请注明出处“美国主机侦探”和原文地址！)
微信扫码加好友进群
主机优惠码及时掌握
QQ群号：938255063
主机优惠发布与交流
