Divi 5 5月進度更新：預覽Divi 5的速度

已發表: 2023-06-02

我們正在進行一個巨大的項目，Divi 5，我喜歡每個月向社區更新我們的進展情況。 上個月，我們深入研究了 Divi 5 beta 計劃的五個階段，以更好地了解我們如何以對 Divi 用戶最有利的方式處理這樣一個大項目。 我們正處於第 1 階段，Dev Alpha，我們越來越接近啟動 Dev Beta，屆時新的 Divi 5 API 將得到鞏固。 在我們努力於今年晚些時候首次公開發布的同時，我們將邀請更多開發人員加入該計劃。

在本月的更新中，我們將討論我們對 Divi 5 所做的更新。我還將向您展示 Divi 5 的速度有多快，然後我將讓您先睹為快我們即將推出的 Divi AI 功能！ 讓我們深入挖掘。

我們本月取得的成就

這個月我們做了很多事情！ 隨著我們越來越接近我們的第一個公開版本，我們正在一個接一個地填寫許多小東西，其中 UI 將需要完善，並且需要完成一組可靠的 Divi 功能。 我們處理了部分分隔符、背景視頻、條件選項、響應式內容並修復了一些錯誤。

我們的大部分工作都集中在鞏固 Divi 5 API，這就是 Dev Beta 版本的目的。 這裡的總趨勢是我們正在建立一個基礎，使我們的團隊和開發社區更容易創建出色的 Divi 模塊和功能。 我們需要把這部分做好，這樣其他的一切都會按照我們的意願進行。

我們致力於統一和簡化 Divi 5 的新 REST API。 我們完成了幾個新功能及其實現，旨在顯著減少創建 Divi 模塊所需的時間。 同樣，我們在基礎層面投入了額外的工作，這樣 Divi 5 項目的其餘部分就會更快，我們在 Divi 5 之後添加的所有模塊和功能也會更快地開發。

我們還重構了 Divi 的短代碼轉換方法，這將在向後兼容方面發揮重要作用。

如果您對更詳細的信息感興趣，這裡是最新的變更日誌條目：

Divi 5.0.0-dev-alpha.4

  • 修復 Shortcode 模塊設置模式中背景字段的渲染
  • 使用正則表達式模式條件修復短代碼模塊設置字段可見性。
  • 添加了 Section Dividers 選項的前端渲染。
  • 修復了具有多個選擇器的模塊選項的懸停選項在視覺構建器和前端中無法正常工作的問題。
  • 重構 @divi/scripts 包並添加測試
  • 將類型包發佈到 npm 以準備向公眾發布

Divi 5.0.0-dev-alpha.5

  • 允許 Shortcode 模塊在上一個請求自動中止時發送另一個請求。
  • 當前短代碼模塊為粘性時呈現粘性選項按鈕。
  • 當前短代碼模塊位於粘性模塊內時呈現粘性選項按鈕。
  • 刪除了未使用的默認值 Record<number, string | 在簡碼模塊中記錄 <string, string>> 類型。
  • 修復了在單個產品頁面上顯示的不正確的 Woo Shortcode 模塊元素。 受影響的短代碼模塊：Woo 產品通知、Woo 產品圖片、Woo 添加到購物車、Woo 產品庫存、Woo 產品價格、Woo 相關產品、Woo 產品追加銷售和 Woo 產品。
  • 將 Unsupported 模塊連同模塊 slug、REST API 路由、標籤、測試用例和故事書一起重命名為 Shortcode 模塊。
  • 在模塊背景選項中添加了背景視頻字段。
  • 在沒有 REST API 調用的情況下重構 Visual Builder 中背景視頻的渲染。
  • 在前端添加了背景視頻模塊選項的渲染。
  • 添加了 ScriptData 以在前端初始化背景視頻。
  • 添加了對粘滯狀態下背景視頻模塊選項的支持。
  • 更新了模塊選項中分隔符字段的可見性，以在未選擇分隔符樣式時隱藏其他選項。
  • 更新了模塊選項中分隔線水平重複設置的可見性，以隱藏明確拒絕重複的分隔線樣式選項。
  • 更新了模塊選項中分隔線排列設置的可見性，以隱藏在全寬部分設置中（其中僅允許默認值“下方”）。
  • 更新了模塊選項中的分隔線樣式字段預覽，以反映當前應用於分隔線的任何水平和/或垂直翻轉。
  • 更新了模塊選項中的分隔線高度字段，以允許在默認像素（“px”）單位之外保存百分比（“%”）值。
  • 更新了 Module Options 中的 Divider Horizo​​ntal Repeat 設置，僅接受正數值（“1x”或更高）。
  • 添加了條件選項基礎，包括作者、登錄和用戶角色的初始條件，其餘條件將在未來版本中逐步添加。
  • 添加了 ElementComponents 組件，相當於 <ElementStyle /> 但用於渲染的 HTML 元素。
  • 添加了 elementClassnames() 函數，相當於 <ElementStyle /> 但用於輸出類名的函數。
  • 修復了字體標題級別錯誤。
  • 修復了投資組合模塊中觸發的 PHP 警告。
  • 正確的 REST 權限回調已添加到所有已註冊的 REST 路由。
  • 引入了一個新的 RoleEditor 類來確定 Divi 角色，包括測試從 D4 重構到 D5 的功能。
  • .sendRequest() 功能，例如自動添加 ET 和 WP 隨機數以及流響應支持，已添加到 fetch()。
  • fetch() 已被完全重構以獲得更好的可維護性和可擴展性，允許引入新的和復雜的條件和功能，例如 .sendRequest() 的選項。
  • 所有 REST API 調用 fetch()、loggedFetch() 和 .sendRequest() 已統一，現在只使用 loggedFetch()。
  • 重構模塊的轉換機制。

Divi 5.0.0-dev-alpha.6

  • 改進並簡化了 REST API 註冊、邏輯、模式和測試。 將 divi/ajax 包重命名為 divi/rest 包。
  • 為內聯文本編輯器添加了 InlineTextEditorContainer 和 InlineTextEditor 組件。
  • 為內聯文本編輯器添加了 onBlur、onClick、onDoubleClick、onKeyDown、onKeyUp、onMouseDown 和 onMouseUp 處理程序。
  • 添加了一種保存機制來更新內聯文本編輯器字段中的屬性值。
  • 添加事件處理程序以激活和停用內聯文本編輯器的編輯模式。
  • 添加了基於激活/停用和其他狀態（如 __empty、__editing、__html）的類名。
  • 為內聯文本編輯器添加了 CSS/內聯樣式。
  • 重構 WindowEventEmitterInstance 以添加 mousedown 事件偵聽器。
  • 引入了響應式內容 PHP 幫助程序。
  • 引入了響應式內容 JS 幫助器。
  • 在 FE 腳本中添加了響應式內容功能。
  • 在 Team Member 模塊的 Name、Position、Image 和 Content 元素中添加了響應式內容實現
  • 在條形計數器模塊的使用百分比、百分比和標題元素中添加了響應式內容實現
  • 在 Button 模塊的 Button Text 元素中添加了響應式內容實現。
  • 在 Toggle 模塊的 Title 和 Content 元素中添加了響應式內容實現。
  • 在 Text 模塊的 Text Inner 元素中添加了響應式內容實現。
  • 在倒數計時器模塊的標題元素中添加了響應式內容實現。
  • 在音頻模塊的標題、圖像、藝術家姓名和專輯名稱元素中添加了響應式內容實現。
  • 在 Code 模塊的 Content 元素中添加了響應式內容實現。
  • 在 CTA 模塊的標題、內容和按鈕元素中添加了響應式內容實現。
  • 在圖像模塊中添加了響應式內容實現。
  • 在 Circle Counter 模塊的 Title 元素中添加了響應式內容實現。
  • 在 Number Counter 模塊的 Title 元素中添加了響應式內容實現。
  • 在選項卡模塊的標題和內容元素中添加了響應式內容實現。
  • 在登錄模塊的標題和內容元素中添加了響應式內容實現。
  • 在 Divider 模塊的 Show Divider 選項中添加了響應式內容實現。
  • 在全角標題模塊的標題、副標題、內容、徽標圖像、標題圖像、按鈕一文本和按鈕二文本元素中添加了響應式內容實現。
  • 在 Fullwidth Image 模塊中添加了響應式內容實現。
  • 在 Portfolio 模塊的 Title 和 Content 元素中添加了響應式內容實現。
  • 將與 Shortcode 模塊相關的代碼重新定位到 Shortcode Module 包。
  • 在 ElementStyle 組件上添加字體標題樣式渲染器。

Divi 5的速度

在我們結束今天的帖子之前，我想討論一下速度。 如您所知，我們不打算向 Divi 5 添加許多（如果有的話）新功能。但是，這個新版本將帶來的最重要的變化之一是速度的大幅提高，尤其是在 Visual Builder 中，我們都在那裡度過了很多時間。

儘管 Divi 5 UI 尚未完成，並且構建器缺少功能，但我仍然想讓您先睹為快，了解我一直在談論的性能差異。 所以請不要對這個視頻中的內容做出判斷，它會發生變化，而只關注交互的速度！

當元素懸停在頁面上時，您會立即註意到所有內容都會立即出現。 打開設置彈出窗口同樣快速，調整設計設置也是如此。 這是全面的晝夜差異。 此外，頁面變得有多大和多複雜並不重要。 Visual Builder 可以處理它，而且速度很快。

在 Divi 4 中不可能達到這種速度水平，這也是 Divi 5 重新架構如此重要的原因之一。

即將推出：Divi AI

這就是本月 Divi 5 更新的全部內容。 不過，我確實為您準備了另一則預告片。 雖然幾乎我們整個團隊都專注於 Divi 5，但我們仍有一小部分人致力於 Divi 4 的功能，這些功能不會影響 Divi 5 的開發，而現在，我們正在做一些非常令人興奮的事情。

它稱為 Divi AI，它利用大型語言模型幫助您在構建器內為您的 Divi 網站創建內容，例如文本和圖像！ 由於它已集成到 Divi 中，我們可以教授有關構建器和您的網站的知識，以幫助它以有意義且非常直觀的方式創建或改進您的內容。

查看今天的 Youtube 視頻，先睹為快 Divi AI。

敬請期待更多的更新

這就是我們 5 月進度報告的全部內容。 如果您有任何問題，請務必發表評論。 敬請期待下個月的更新，我們下期再見！