WooCommerce: почему и как отключить фрагменты корзины Ajax

Если вы здесь, это потому, что ваш веб-сайт WooCommerce работает медленно, и вам интересно, почему URL-адрес « /?wc-ajax=get_refreshed_fragments » вызывает задержки и нагрузку на сервер (всплески).

Кроме того, существует слишком много онлайн-литературы о WooCommerce Ajax Cart Fragments (включая конкретные плагины и параметры плагинов производительности), и вы хотите быстро узнать, что они из себя представляют, прежде чем понимать, следует ли их отключать и как.

Инструменты оптимизации производительности, такие как Pingdom и GTMetrix, часто возлагают вину на эту маленькую функциональность WooCommerce. И осторожное его отключение может дать вам повышение скорости, загрузки страницы и, в конечном итоге, коэффициента конверсии продаж.

Итак, вот все, что вам нужно знать.

Что такое фрагменты корзины WooCommerce Ajax?

Но сначала для тех из вас, кто этого не знает: что такое Ajax ?

В веб-разработке Ajax ( AJAX = асинхронный JavaScript и XML ) — это метод веб-разработки, который, в двух словах, позволяет запускать функции без обновления страниц веб-сайта .

Подумайте об «Ajax Add to Cart» на странице магазина WooCommerce: вы можете добавлять товары в корзину (и обновлять корзину) без принудительной перезагрузки страницы; Ajax работает в фоновом режиме и взаимодействует с сервером «асинхронно».

Теперь, когда это ясно, давайте разберемся, что такое фрагменты корзины WooCommerce Ajax и что представляет собой URL-адрес « yoursite.com/?wc-ajax=get_refreshed_fragments ».

Короче говоря, даже на небольших сайтах и ​​даже на страницах, отличных от WooCommerce, WooCommerce пытается «получить» информацию о корзине, чтобы быть готовым «пересчитывать» корзину каждый раз, когда что-то делается (или не делается!) на заданной странице WordPress.

Это позволяет WooCommerce обновлять виджет «Корзина» и немедленно «прослушивать» любое событие «Добавить в корзину» Ajax, для которого может потребоваться обновление корзины .

По сути, WooCommerce вызывает « /?wc-ajax=get_refreshed_fragments » для асинхронного обновления элементов корзины и общей суммы корзины, то есть без необходимости обновления страницы веб-сайта, которую вы посещаете.

Ajax великолепен и все такое, однако не стоит недооценивать последствия для производительности и конфликты плагинов, которые может вызвать эта маленькая функциональность. Что приводит нас к следующему разделу…

Зачем отключать фрагменты корзины WooCommerce Ajax?

Чтобы обновить корзину на каждой странице вашего веб-сайта, WooCommerce каждый раз запускает эту функцию Ajax.

Даже на странице «О нас». Даже на главной странице, если у вас нет товаров. Даже на странице контактов, если у вас есть только контактная форма.

Если в вашей теме нет выпадающего виджета корзины WooCommerce, и если у вас нет товаров, которые можно добавить в корзину на определенной странице веб-сайта, то вам лучше удалить всю функциональность Ajax.

Более того, если вы выберете в настройках WooCommerce перенаправление пользователей в корзину после добавления любого продукта в корзину, вы определенно форсируете перенаправление страницы (на страницу корзины), поэтому наличие активных фрагментов корзины Ajax совершенно бессмысленно.

В идеале единственными местами, где должен работать « /?wc-ajax=get_refreshed_fragments », являются страницы и архивы WooCommerce, где ваши клиенты могут добавлять в корзину, И вы хотите использовать виджет динамической корзины.

Например, если у вас есть кнопки «Добавить в корзину» на страницах категорий И вы хотите, чтобы виджет «Корзина» обновлялся соответствующим образом без перезагрузки страницы (и у вас включено добавление в корзину Ajax), вам нужно « /?wc-ajax=get_refreshed_fragments » активный.

Кроме того, на странице корзины вы можете изменить количество или удалить товары, не обновляя страницу, и там вы также хотите, чтобы виджет корзины обновлялся соответствующим образом (но реальный вопрос здесь: почему на странице корзины есть виджет корзины, поскольку он смысла нет? ). Итак, на странице корзины вам также необходимо активировать «/?wc-ajax=get_refreshed_fragments» , иначе виджет не будет обновляться, если вы обновите корзину.

Вывод:

1. если в вашей теме НЕТ виджета корзины с динамическим заголовком , вы можете отключить «/?wc-ajax=get_refreshed_fragments»
2. если ваша тема имеет виджет корзины с динамическим заголовком, но вам не нужно показывать содержимое виджета корзины на ходу , вы можете везде отключить «/?wc-ajax=get_refreshed_fragments».
3. если вы хотите, чтобы функциональность виджета «Корзина» оставалась активной , вам следует отключить «/?wc-ajax=get_refreshed_fragments» ТОЛЬКО на тех страницах, где нет функции «Добавить в корзину» Ajax (архивы продуктов WooCommerce) или функции обновления корзины (страница «Корзина»)

Как отключить фрагменты корзины Ajax WooCommerce?

Теперь, когда мы поняли, что такое фрагменты корзины и почему/когда их следует удалять, мы можем немного заняться кодированием.

Конечно, для этого есть плагины, но когда вы можете добиться такой функциональности с помощью нескольких строк PHP, нет смысла искать другое решение, даже если вы не знаете, как программировать.

Но сначала давайте посмотрим, как WooCommerce добавляет этот вызов Ajax (в терминах разработки мы бы сказали «как он ставит этот скрипт в очередь»).

Прежде всего, скрипт « wc-cart-fragments » описывается функцией «register_scripts()». Он вызывает скрипт JS из папки /assets и требует включения JQuery и файлов cookie:

'wc-cart-fragments' => array(
	'src'     => self::get_asset_url( 'assets/js/frontend/cart-fragments' . $suffix . '.js' ),
	'deps'    => array( 'jquery', 'js-cookie' ),
	'version' => WC_VERSION,
),

В том же файле это время вызова wc-cart-fragments :

self::enqueue_script( 'wc-cart-fragments' );

Если мы посмотрим на функцию «enqueue_script()», то обнаружим, что наш скрипт « wc-cart-fragments » сначала регистрируется, а затем ставится в очередь в соответствии с документацией WordPress (https://developer.wordpress.org/reference/ функции/wp_enqueue_script):

private static function enqueue_script( $handle, $path = '', $deps = array( 'jquery' ), $version = WC_VERSION, $in_footer = true ) {
	if ( ! in_array( $handle, self::$scripts, true ) && $path ) {
		self::register_script( $handle, $path, $deps, $version, $in_footer );
	}
	wp_enqueue_script( $handle );
}

Если что-то «поставлено в очередь», то оно может быть «удалено из очереди» (аналогично PHP-функциям add_action() и remove_action()).

Вы должны обязательно вызвать функцию «удалить из очереди» ПОСЛЕ «поставить в очередь», чтобы она уже была добавлена, и вы можете ее удалить (следовательно, приоритет = 11, поскольку «wc-cart-fragments» ставится в очередь с приоритетом по умолчанию 10).

Тл;др:

/**
 * @snippet       Disable WooCommerce Ajax Cart Fragments Everywhere
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 3.6.4
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'wp_enqueue_scripts', 'bbloomer_disable_woocommerce_cart_fragments', 11 ); 

function bbloomer_disable_woocommerce_cart_fragments() { 
	wp_dequeue_script( 'wc-cart-fragments' ); 
}

Обратите внимание, что если у вас есть виджет корзины в шапке, это сломает «выпадающую корзину». Вы по-прежнему сможете видеть количество товаров и общую сумму корзины в заголовке, но при наведении вы не увидите элементы и кнопки корзины/оформления заказа .

В Business Bloomer я полностью отключил виджет «Корзина», поэтому имеет смысл использовать эту функцию.

Если вы хотите просто оптимизировать свою домашнюю страницу и оставить «фрагменты wc-cart» на других страницах сайта , вы можете вместо этого использовать этот фрагмент:

/**
 * @snippet       Disable WooCommerce Ajax Cart Fragments On Static Homepage
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 3.6.4
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'wp_enqueue_scripts', 'bbloomer_disable_woocommerce_cart_fragments', 11 ); 

function bbloomer_disable_woocommerce_cart_fragments() { 
	if ( is_front_page() ) wp_dequeue_script( 'wc-cart-fragments' ); 
}

Заключительные мысли: Фрагменты корзины Ajax WooCommerce да или нет?

Мы видели, что отключение Ajax Cart Fragments «может» дать вам повышение скорости веб-сайта, но также «может» вызвать некоторые проблемы, в основном, если вы хотите продолжать использовать раскрывающийся виджет «Корзина».

Итак, в этом разделе я хочу посмотреть, что другие узнали о «/?wc-ajax=get_refreshed_fragments».

Действительно ли это дает вам больше преимуществ, чем недостатков? Действительно ли это увеличивает скорость страницы вашего сайта? Стоит ли отключать фрагменты корзины?

Спойлер: это зависит .

Колм Трой из CommerceGurus тщательно протестировал фрагменты корзины Ajax (а также другие фрагменты, которые вы должны прочитать в его статье: https://www.commercegurus.com/guides/speed-up-woocommerce/), и в своем руководстве он обнаружил что:

… время запроса «/?wc-ajax=get_refreshed_fragments» занимает 448 мс, что на данный момент является самым медленным HTTP-запросом.

На некоторых более медленных серверах с большими, плохо оптимизированными базами данных выполнение этого запроса часто может занимать более 1-2 секунд.

Хорошей новостью является то, что этот запрос не блокирует и выполняется после загрузки DOM, поэтому в целом он не влияет на наше предполагаемое время загрузки (но определенно ухудшает время полной загрузки и может повредить некоторые вещи, о которых беспокоится GPSI, например время). в Интерактивный и Первый ЦП простаивает).

Он также сказал мне недавно, что:

Я пришел к выводу, что новички в WooCommerce часто в конечном итоге ломают свои сайты, удаляя фрагменты, поскольку они не полностью продумали все различные сценарии появления виджета корзины, поэтому с ним определенно следует действовать осторожно.

В магазинах WooCommerce с пиками нагрузки и тоннами трафика первое, что мы делаем, — это удаляем фрагменты корзины из очереди, удаляем виджеты корзины и перенаправляем клиентов в корзину при добавлении в корзину .

Делает вещи красивыми, простыми и быстрыми

Хотите продолжить разговор? Делитесь своими отзывами, тестами и мнением в комментариях