7種方法讓你的Magento 2主題模板速度加快

Magento 2作為功能強大且功能豐富的電子商務平臺。它提供了不錯的頁面加載速度,但在大量定制下可能會非常緩慢。

部分性能問題可能是一個開發不標準的自定義主題引起的(在這里重聲下,magento有兩大主題模板市場,一個$89,一個$179,作為技術的我深知兩大模板的優劣,總之不要圖一時便宜)。一方面,默認的Luma和Blank主題相當快。另一方面,一些定制的主題很慢,可能會讓你的網上商店成為一個噩夢。

 

我將分享一些技巧來優化Magento2主題模板讓他更快。這些小技巧都是經過實踐驗證的,他們真的很有用。我已經在各個項目中使用它們,以使Magento 2網站有一個不錯的頁面加載時間速度。

加快Magento 2主題模板的7個技巧

  1. 切勿在循環中加載Magento模型。
  2. 縮小HTML。
  3. 切勿使用JS捆綁。
  4. 合并和縮小CSS / JS。
  5. 避免CSS / JS框架。
  6. 優化圖像。
  7. 盡量減少第三方擴展的數量。

1.永遠不要將Magento模型加載到循環中

這事兒常常發生。我經常看到這樣的PHP代碼:

foreach($ productCollection as $ product){

$ _product = $ productModelFactory-> create() - > load($ product-> getId())

...。

您可能會在Magento 2迭代集合的各種list.phtml模板中看到該結構

我會解釋為什么這對性能不好。Magento 2模型負載很重,需要太多時間。再加上集合不斷的循環可能會顯著減慢站點的速度。

另外,不需要加載模型,因為一個集合已經具有可能需要的所有數據。所以你最好檢查一下你的主題模板文件和重構代碼部分是否包含模型循環。

如何找出要檢查的主題模板?使用Magento 2分析器 - 它將顯示最慢的代碼塊。要啟用Magento 2分析器,只需將以下代碼添加到index.phppub/index.php

$ _SERVER ['MAGE_PROFILER'] = 1;

重新加載網站頁面,您將在底部看到配置文件跟蹤:

Magento 2探查器跟蹤

研究跟蹤,你會看到哪些模板花費時間最多。

2.縮小HTML

如果可以縮小頁面大小,可以使主題更快。其中一種方法是縮小HTML。
Magento 2支持開箱即用頁面縮小。您可以轉至Stores > Configuration > Advanced > Developer > Template Settings > Minify HTML并將其打開(在Magento 2.2+上,此設置僅在開發人員模式下可見):

在Magento中縮小HTML

有一點要記住 - 這種配置更改僅適用于生產和默認模式。

你可能會問 - 這些模式是什么?Magento 2有三種運行模式:default(默認模式), developer(開發者模式) 和 production(生產模式)生產模式是最快的,它用于為上線網站提供動力。另一方面,為了調整和更改商店,您可能需要打開開發人員模式。

要了解網站的模式,可以在Magento根文件夾中運行此SSH命令:

php bin/magento deploy:mode:show

要切換到生產模式,請運行:

php bin/magento deploy:mode:set production

HTML縮小可以縮小到高達原始頁面大小的50%,因此您可以嘗試一下。

3.永遠不要使用JS捆綁

JS捆綁是Magento 2的一個特殊功能,它將JS文件分組在一起,以減少Web瀏覽器加載頁面所需的HTTP請求數量。在HTTP1下可以使網站更快,但它對于HTTP2是沒有用的。

由于其他原因,JS捆綁也沒用。發生的情況是,這個龐大的捆綁JavaScript文件 大小為5-12Mb,顯著降低了商店的速度(尤其是在網絡較慢的情況下)。

所以去Stores > Configuration > Advanced > Developer > Javascript Settings并且設置啟用JS捆綁為NO:

JS捆綁在Magento中

我建議使用HTTP / 2的強大功能,而不是JS捆綁。HTTP協議的新版本設計時考慮到了性能,并且可以真正加速任何站點,包括Magento。

另一個解決方法是使用CDN(內容分發網絡)。用它來加載靜態文件比服務器加載的時間快了很多,而且它具有動態圖像優化功能和各種緩存選項。

4.合并和縮小CSS和JS文件

Magento 2具有縮小CSS和JavaScript的內置功能。這對性能有好處,因為它可以減少頁面負載。

要設置縮小和合并,請轉至后端菜單Stores > Configuration > Advanced > Developer > CSS and Javascript settings

在Magento admin中縮小CSS JS

請注意,JS / CSS minification僅適用于生產和默認運行模式。

5.避免第三方CSS/JS框架

我建議在構建Magento 2主題時避免使用任何外部前端庫(除了那些最初與M2一起提供的庫)。第三方框架可能使網站變慢。

與Magento 2一起提供的jquery應該足以滿足任何javascript需求。

6.優化圖像

電子商務網站往往有很多圖像。保持它們的優化和盡可能小的尺寸是非常重要的。

我會在這里強調3種方式來照顧您的目錄圖片:

  1. CDN(內容分發網絡) - 幾乎所有這樣的網站都具有某種圖像優化功能。如果您的預算允許,您可以試一試。
  2. Google PageSpeed Module - 此服務器擴展(由Google開發)可以壓縮圖像并自動執行其他速度優化。您可能需要系統管理員幫助進行正確設置和配置。
  3. 各種在線工具 - 如果您沒有那么多的圖片,您可以逐個手動優化它們。有不少在線工具可以壓縮圖片。

7.保持第三方擴展的數量最少

根據我的經驗,如果有一個緩慢的Magento網站,在大多數情況下,有很多自定義插件。市場上的一些第三方擴展可能會顯著影響性能。

自定義模塊的問題在于,它們通常是在沒有速度基準的情況下編寫的。編碼質量差是我建議將第三方擴展數量保持在最低限度的首要原因。

如果你已經安裝了一堆插件,那么該做一個審查了。逐個禁用它們并測量頁面加載時間。如果擴展在第一個字節(TTFB)中超過100毫秒的時間,則可能需要聯系其供應商并尋求補丁。

如何找到安裝的模塊列表?在Magento根文件夾中運行這個SSH命令:

php bin/magento module:status

忽略以Magento_開頭的模塊- 這些是核心擴展。

要禁用擴展,您可以簡單地從app/code中刪除它的文件夾并運行:

php bin/magento setup:upgrade

總結

Magento 2自定義主題可能會很慢,但有一些方法可以使其更快速:

  • 注意第一個字節的時間,并嘗試使用分析器來降低它。
  • 保持頁面大小最小并始終壓縮圖像。
  • 檢查主題模板并糾正不良的PHP代碼塊。
  • 縮小HTML,CSS,JS。
  • 不要使用JS捆綁 - 它有害無益。

上一篇: Magento2 管理會員密碼安全性 下一篇:如何修復在Magento 2中重新索引時的死鎖錯誤
  • 版權聲明:內容來自互聯網不代表本站觀點,2018-06-13發表于 magento教程欄目。
  • 轉載請注明: 7種方法讓你的Magento 2主題模板速度加快| magento教程 +復制鏈接