Время чтения: 2 мин. 25 января 2019 в 16:43 Woocommerce
Звёзд: 1Звёзд: 2Звёзд: 3Звёзд: 4Звёзд: 5
Загрузка...

Оптимизация и ускорение вукомерс. Как загружать скрипты и стили WooCommerce для улучшения скорости загрузки страницы

Если вы используете WooCommerce для продажи в WordPress, вы можете заметить, что добавляется несколько дополнительных скриптов на всех страницах вашего сайта. Эту ситуацию можно исправить, скажем WooCommerce загружает их только на страницах магазина и улучшает скорость загрузки страницы.
woocommerce-thumb Оптимизация и ускорение вукомерс. Как загружать скрипты и стили WooCommerce для улучшения скорости загрузки страницы

Перед рассмотрением следует рассмотреть несколько вопросов:

  • У вас есть какие-либо элементы на вашем сайте, которые зависят от сценариев WooCommerce за пределами основных страниц WooCommerce (магазин, корзина, выписка и т. Д.)? Это может быть элемент корзины в вашем заголовке или, возможно, некоторые виджеты боковой панели, найденные на вашем сайте.
  • У вас есть среда тестирования — пожалуйста, не делайте код ковбоя на своем сайте электронной коммерции!
  • Вам должно быть удобно редактировать тему и файлы кода

Если у вас есть все необходимые инструменты и знания, начнем с изучения того, какие сценарии мы удаляем из областей, не относящихся к WooCommerce нашего сайта.

Какие скрипты WooCommerce мы удаляем?

woocommerce-param-junk Оптимизация и ускорение вукомерс. Как загружать скрипты и стили WooCommerce для улучшения скорости загрузки страницы  Откройте свой веб-сайт WordPress с установленной и активной WooCommerce. Взгляните на исходный код, и вы увидите множество файлов JavaScript и CSS, специфичных для WooCommerce, а также метатег генератора и целый блок параметров woocommerce (см. Снимок экрана).

Сценарии

  • woocommerce.min.js
  • checkout.js
  • добавить к cart.min.js
  • jquery.cookie.min, Я.С.
  • Корзина-fragments.min.js
  • jquery.blockUI.min.js
  • jquery.placeholder.min.js
  • … MOAR ?!

woo-scripts Оптимизация и ускорение вукомерс. Как загружать скрипты и стили WooCommerce для улучшения скорости загрузки страницы

Стили

  • woocommerce.css
  • Любые стили лайтбокса (prettyphoto)
  • Пользовательский CSS для WooCommerce
  • … возможно, дополнительный CSS в зависимости от вашей установки.

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

Давайте рассмотрим, сколько дополнительной загрузки WooCommerce фактически добавляет мой конкретный тестовый сайт.

Перед оптимизацией сценария WooCommerce: 

pre-woocommerce-optimization-stats Оптимизация и ускорение вукомерс. Как загружать скрипты и стили WooCommerce для улучшения скорости загрузки страницы

Я запустил свой сайт через webpagetest.org, чтобы увидеть результаты без какой-либо опции optmization. Вы можете видеть из этого теста, что сайт составляет примерно 1,6 МБ с 75 загруженными запросами. Этот сайт не находится на мощном хосте, так что время загрузки сейчас под-пар.

После оптимизации скрипта WooCommerce:

post-woocommerce-optimization-stats Оптимизация и ускорение вукомерс. Как загружать скрипты и стили WooCommerce для улучшения скорости загрузки страницы

Мы перешли с 7,2 секунд до 5,8 секунд времени загрузки … неплохо.

Вы можете видеть, что после оптимизации запросы упали на 9 с 75 до 66 полностью загруженных. Кроме того, общий байт также упал, а сайт в настоящее время составляет около 1,5 мб. Число, которое меня поражает, — это общее время загрузки, которое упало почти на 1,4 секунды.

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

Код для оптимизации и ускорения ваших скриптов WooCommerce

Следующий код — это то, что у меня есть, чтобы удалить стили и скрипты WooCommece. Поскольку это специфичная для темы функциональность, я рекомендую добавить это в файл functions.php вашей темы через отдельный плагин.

Добавьте следующий код в тему functions.php

… вот суть , из которой тянет код выше.

После добавления кода обновите исходный код для страниц, не относящихся к WooCommerce. Вы должны увидеть, что все скрипты, стили и метатег исчезают. Он также должен загружаться заметно быстрее. Если вам нужны конкретные сценарии, такие как jQuery UI или FancyBox, вы можете прокомментировать определенные строки, деинсталлирующие эти сценарии.

Заметьте условные утверждения , которые мы используем: ! is_woocommerce() && ! is_cart() && ! is_checkout(). Если вам нужно загрузить сценарии WooCommerce на своем сайте за пределами магазина и страниц проверки, вы можете легко изменить этот скрипт для работы в конкретной ситуации. Например, если вы хотите загрузить сценарии WooCommerce на своей домашней странице, вы добавите !is_homeусловия.

Обертывание
В зависимости от того, как вы используете WooCommerce, может быть разумным внимательно изучить оптимизацию его вывода. Я сторонник загрузки сайта, и когда плагины объединяют все свои стили и скрипты в глобальном масштабе, это доходит до меня. Я хочу, чтобы мои сценарии и стили были максимально чистыми. Я бы хотел, чтобы Woo мог еще больше оптимизировать свою работу. Я понимаю, что существует так много случаев использования, что это может не иметь смысла.

Я надеюсь, что этот код окажется полезным для вашего сайта и снизит скорость загрузки вашей страницы. Специальный крик идет к Грегу Рикаби за его оригинальный код, найденный в его статье « Удалите стили и скрипты WooCommerce», которые я слегка изменил и улучшил.

Источник: https://wordimpress.com/how-to-load-woocommerce-scripts-and-styles-only-in-shop/

Похожие статьи

Давайте знакомиться!
Я в социальных сетях, добавляйтесь!
Написать мне
У вас появился вопрос? Предложение? Пишите, я отвечу вам в течение 10 минут, в рабочее время.
Ваше имя * Ваш e-mail* Ваш сайт Сообщение * Прикрепите файл, если требуется
Степень загрузки
В данном разделе представлена моя занятость в данный момент. Данные обновляются каждый день. Вся работа выполняется по предварительной записи и 20% предоплатой от стоимости проекта.
низкая загрузка. выполняется ~5 заказов. старт работ через 5 дней.
средняя загрузка. выполняется ~15 заказов. старт работ через 20 дней.
высокая загрузка. заказы временно не принимаются.
Получить коммерческое предложение
Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.
Введите ваше имя * Введите контактный телефон * Введите контактный e-mail * Какая услуга Вас интересует? * Допонительные услуги Комментарий
Получить коммерческое предложение
Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.
Введите ваше имя * Введите контактный телефон * Введите контактный e-mail * Какая услуга Вас интересует? * Допонительные услуги Комментарий
Получить консультацию
Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.
Введите ваше имя * Введите контактный телефон * Введите контактный e-mail * Комментарий
Получить консультацию
Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.
Введите ваше имя * Введите контактный телефон * Введите контактный e-mail * Комментарий
[contact-form-7 404 "Not Found"]
[contact-form-7 404 "Not Found"]
Начать сотрудничество
Заполните поля ниже. Я лично перезвоню Вам в течении 15 минут для обсуждения деталей.
Введите ваше имя * Введите контактный телефон * Введите контактный Email для отправки точной стоимости
или позвоните мне по телефону +7-499-70-300-44
Получить консультацию
Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.
Введите ваше имя * Введите контактный телефон * Введите контактный e-mail * Комментарий
[contact-form-7 404 "Not Found"]
Рассчитать стоимость
Заполните поля ниже. Я свяжусь с Вами в течении 15 минут в рабочее время для обсуждения деталей
Введите контактный телефон * Введите контактный e-mail * Опишите ваш вопрос для того чтобы я мог рассчитать стоимость Прикрепить файл,если необходимо
Получить коммерческое предложение
Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.
Введите ваше имя * Введите контактный телефон * Введите контактный e-mail * Какая услуга Вас интересует? * Допонительные услуги Комментарий
Рассчитать стоимость
Заполните поля ниже. Я свяжусь с Вами в течении 15 минут в рабочее время для обсуждения деталей
Введите контактный телефон * Введите контактный e-mail * Опишите ваш вопрос для того чтобы я мог рассчитать стоимость Прикрепить файл,если необходимо
Запись на бесплатный урок
Введите ваше имя, телефон и Skype логин и email. Я свяжусь с Вами для уточнения времени прохождения урока.
Введите контактный телефон * Введите ваше Skype логин * Введите контактный E-mail * Выберите программу
Введите ваше имя * Введите контактный email * Опишите ваш вопрос в произвольной форме Прикрепить файл,если необходимо
Заказать сайт
Первые 14 дней бесплатно. Оставьте номер email и контактный телефон. Я лично перезвоню Вам в течении 10 минут, для обсуждения деталей.

Ваш email Введите контактный телефон Комментарий или вопрос
Проблемы с оплатой?
Опишите ситуацию. Когда возникает проблема? Что планируете купить?
Введите ваше имя * Введите контактный email * Что необходимо доработать
Скачать чек-лист
Заполните поля ниже. В течении 10 минут на указанный e-mail будет отправлена ссылка на скачивание чек-листа.
Введите ваше имя * Введите контактный E-mail *
Предварительная запись для получения скидки
Введите ваше имя, телефон и Skype логин и email. Я свяжусь с Вами для уточнения деталей прохождения курса.
С кого числа Вам удобней начать обучение в 2019 году? Введите контактный телефон * Введите контактный E-mail * Выберите программу
Курс SEO для интернет-магазинов

Из данного курса вы узнаете как превратить ваш интернет магазин рабочую лошадку, генерирующую по нарастающей поток клиентов из 300 человек в месяц, в 10 000 в день. С любым ассортиментом.

Особенности продвижения интернет-магазинов, специфика оптимизации. Как избавить себя от рутинной оптимизации каждой страницы и в 1 клик оптимизировать до 10 000 тыс товаров.

А также вы в разы увеличите продажи, значительно снизите стоимость клика и стоимость заявки, в перспективе сможете отказаться от контексной рекламы (только для акций), откроете новые горизонты.

И да, все это урок за уроком я лично расскажу Вам и помогу внедрить.

Длительность обучения 30 дней.

Запись на бесплатный урок
Введите ваше имя, телефон и Skype логин и email. Я свяжусь с Вами для уточнения времени прохождения урока.
Введите контактный телефон * Введите ваше Skype логин * Введите контактный E-mail * Выберите программу
Курс SEO для корпоративных сайтов

Данный курс поможет вашему бизнесу получить новых клиентов из органического трафика.

А также вы в разы увеличите продажи, значительно снизите стоимость клика и стоимость заявки, в перспективе сможете отказаться от контексной рекламы (только для акций), откроете новые горизонты.

И да, все это урок за уроком я лично расскажу Вам и помогу внедрить.

Длительность обучения 20 дней.

Запись на бесплатный урок
Введите ваше имя, телефон и Skype логин и email. Я свяжусь с Вами для уточнения времени прохождения урока.
Введите контактный телефон * Введите ваше Skype логин * Введите контактный E-mail * Выберите программу
Курс SEO для Landing Page

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

Курс научит Вас оптимизировать и продвигать одностраничные сайты.

И да, все это урок за уроком я лично расскажу Вам и помогу внедрить.

Длительность обучения 1 день.

Запись на бесплатный урок
Введите ваше имя, телефон и Skype логин и email. Я свяжусь с Вами для уточнения времени прохождения урока.
Введите контактный телефон * Введите ваше Skype логин * Введите контактный E-mail * Выберите программу
Курс SEO для самостоятельного обучения

В закрытом разделе моего сайта весь курс представлен в текстовом/видео формате. Если вы желаете обучаться самостоятельно по актуальным данным которые работают в данный момент (поскольку данную информацию я обновляю сразу по мере изменений от поисковых систем) этот курс для вас.

Вы шаг за шагом приведете свой сайт в порядок и сможете увеличить трафик на 500% минимум!!!

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

Получить консультацию
Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.
Введите ваше имя * Введите контактный телефон * Введите контактный e-mail * Комментарий
Я работаю в городе Москва, но работу строю удаленно, и ваш город Абакан, Абинск, Аксай, Александровское, Алексин, Альметьевск, Анапа, Ангарск, Апшеронск, Арзамас, Армавир, Архангельск, Ачинск, Балаково, Балашиха, Балашов, Барнаул, Батайск, Белая Калитва, Белгород, Белореченск, Березники, Бийск, Благовещенск, Благодарный, Борисоглебск, Братск, Бронницы, Брюховецкая, Брянск, Бугульма, Буденновск, Бузулук, Великие Луки, Великий Новгород, Владивосток, Владикавказ, Владимир, Волгоград, Волгодонск, Волжский, Вологда, Волхов, Воркута, Воронеж, Воскресенск, Выборг, Выкса, Выселки, Гатчина, Геленджик, Георгиевск, Горно Алтайск, Грозный, Губкин, Гудермес, Гуково, Гусь Хрустальный, Десногорск, Дзержинск, Димитровград, Дмитров, Домодедово, Донецк, Ейск, Екатеринбург, Елец, Ессентуки, Железногорск, Железногорск Красноярский край, Железнодорожный, Зеленоград, Зеленокумск, Иваново, Ивантеевка, Ижевск, Изобильный, Ипатово, Иркутск, Йошкар Ола, Казань, Калуга, Каменск Шахтинск, Камышин, Каневская, Кашира, Кемерово, Кинешма, Кириши, Киров, Клин, Клинцы, Ковров, Коломна, Комсомольск на Амуре, Кореновск, Королёв, Кострома, Котлас, Красногорск, Краснодар, Красноярск, Крымск, Кстово, Кузнецк, Курган, Курганинск, Курск, Кущевская, Лабинск, Ленинградская, Ленинск Кузнецкий, Ливны, Липецк, Лобня, Лысьва, Лыткарино, Люберцы, Москва, Магнитогорск, Майкоп, Междуреченск, Миасс, Миллерово, Минеральные воды, Михайловск, Мичуринск, Можайск, Мончегорск, Морозовск, Мостовской, Мурманск, Муром, Мытищи, Набережные Челны, Назрань, Нальчик, Находка, Невинномысск, Нерюнгри, Нефтекамск, Нефтекумск, Нефтеюганск, Нижневартовск, Нижнекамск, Нижний Новгород, Нижний Тагил, Новоалександровск, Новокузнецк, Новомосковск, Новороссийск, Новосибирск, Новочеркасск, Новошахтинск, Норильск, Ноябрьск, Нягань, Одинцово, Октябрьский, Омск, Орёл, Оренбург, Орехово Зуево, Орск, Отрадная, Павловская, Павловский Посад, Пенза, Пермь, Петрозаводск, Петропавловск Камчатский, Подольск, Приморско Ахтарск, Прокопьевск, Псков, Пушкино, Пятигорск, Раменское, Реутов, Россошь, Ростов на Дону, Рыбинск, Рязань, Санкт Петербург, Сальск, Самара, Саранск, Саратов, Саянск, Светлоград, Северодвинск, Северская, Сергиев Посад, Серов, Серпухов, Славянск на Кубани, Смоленск, Солнечногорск, Сочи, Ставрополь, Староминская, Старый Оскол, Стерлитамак, Сургут, Сызрань, Сыктывкар, Таганрог, Тамбов, Тверь, Темрюк, Тимашевск, Тихвин, Тихорецк, Тобольск, Тольятти, Томск, Трудобеликовский, Тула, Тюмень, Улан Удэ, Ульяновск, Усинск, Усолье Сибирское, Уссурийск, Усть Илимск, Усть Лабинск, Уфа, Ухта, Фрязино, Хабаровск, Ханты Мансийск, Чебоксары, Челябинск, Череповец, Чехов, Чита, Шахты, Шелехов, Щёлково, Электросталь, Энгельс, Южно Сахалинск, Якутск, Ярославльи регионАмурская область, Камчатский край, Приморский край, Республика Саха Якутия, Сахалинская область, Хабаровский край, Кировская область, Нижегородская область, Оренбургская область, Пензенская область, Пермский край, Республика Башкортостан Октябрьский и Нефтекамск, Республика Башкортостан Уфа, Республика Марий Эл, Республика Мордовия, Республика Татарстан, Республика Татарстан Казань, Республика Удмуртия, Республика Чувашия, Самарская область, Саратовская область, Ульяновская область, Архангельская область, Вологодская область, Мурманская область, Новгородская область, Псковская область, Республика Карелия, Республика Коми Воркута и Усинск, Республика Коми Сыктывкар, Республика Ингушетия, Республика Кабардино Балкария, Республика Северная Осетия Алания, Ставропольский край, Чеченская Республика, Алтайский край, Забайкальский край, Иркутская область, Кемеровская область, Красноярский край, Красноярский край Норильск, Новосибирская область, Омская область, Республика Алтай, Республика Бурятия, Республика Хакасия, Томская область, Курганская область, Свердловская область, Тюменская область, Ханты Мансийский АО, Челябинская область, Ямало Ненецкий АО, Белгородская область, Брянская область, Владимирская область, Воронежская область, Ивановская область, Калужская область, Костромская область, Курская область, Липецкая область, Орловская область, Рязанская область, Смоленская область, Тамбовская область, Тверская область, Тульская область, Ярославская область, Волгоградская область, Краснодарский край, Республика Адыгея, Ростовская область,не имеет значения.