Оновлення та новини

Додано параметр fetchpriority для керування завантаженням зображень картки товару

На платформі BooStore.pro додано новий параметр керування завантаженням зображень — fetchpriority. Тепер у налаштуваннях доступний розширений набір режимів, що дозволяє гнучко керувати тим, як і де завантажуються зображення на сайті.

Що змінилося

У системі доступні розширені параметри, які дозволяють:

• вмикати або вимикати loading="lazy"
• керувати додаванням розмірів зображення (width/height)
• вмикати fetchpriority="high" для пріоритетного завантаження (новий параметр)
• задавати різні режими окремо для картки товару та списку товарів
• повністю вимикати або комбінувати параметри

Що таке lazyload і fetchpriority

Lazy Load (loading="lazy") — це відкладене завантаження зображень. Картинки підвантажуються лише тоді, коли користувач прокручує сторінку до них. Це зменшує початкове навантаження та пришвидшує відображення сторінки.

Fetch Priority (fetchpriority="high") — це пріоритетне завантаження зображення. Браузер отримує сигнал, що певне зображення (наприклад, головне зображення товару) має завантажуватися раніше за інші ресурси. Це особливо важливо для LCP-елементів.

Повна гнучкість керування

Нові параметри дозволяють комбінувати режими та точно налаштовувати стратегію завантаження:

• вмикати lazyload лише там, де це необхідно
• додавати розміри зображень для запобігання CLS
• призначати fetchpriority для головних зображень
• розділяти налаштування для списку товарів і картки товару

Для чого це потрібно

Гнучке керування завантаженням зображень дозволяє:

• пришвидшити відображення сторінок
• покращити показники LCP та CLS
• підвищити оцінку в Google PageSpeed
• зменшити навантаження на сервер і браузер
• покращити поведінкові фактори

Тепер у BooStore.pro доступна повна гнучкість керування завантаженням зображень для максимального прискорення сайту та покращення показників Google PageSpeed.

На BooStore.pro додано додаткове горизонтальне меню з категоріями та виробниками

На платформі BooStore.pro став доступний новий вид горизонтального меню з категоріями та виробниками, що покращує навігацію.

Головна особливість оновлення — механізм розкриття: дочірні підкатегорії відкриваються всередині загального блоку у вигляді випадаючого списку, не перекриваючи основний контент і не виходячи за його межі. Інтелектуальне позиціонування гарантує, що блок меню завжди залишається у видимій області та не виходить за межі екрана користувача.

SaaS BooStore.pro повністю відмовляється від зовнішньої бібліотеки jQuery та вже завершила повний рефакторинг на чистий JavaScript.

BooStore.pro повністю відмовилися від Jquery

BooStore.pro офіційно завершили повну відмову від бібліотеки Jquery у ядрі системи. Усі внутрішні скрипти, інтерфейсні компоненти та віджети платформи переведені на чистий Vanilla JavaScript. Це стратегічне рішення стало результатом масштабної технічної модернізації, спрямованої на підвищення швидкості роботи, стабільності та безпеки сайтів.

Чому Jquery довгий час була стандартом

Jquery десятиліттями залишалася основою фронтенду більшості сайтів. У період активного розвитку вебу браузери мали відмінності у підтримці JavaScript, бракувало зручних методів роботи з AJAX, подіями, DOM-маніпуляціями та анімацією. Jquery вирішувала одразу кілька проблем:

• Уніфікація коду для різних браузерів
• Спрощені селектори
• Зручна робота з AJAX
• Велика кількість UI-плагінів
• Швидка розробка інтерфейсів

У ті роки це було справді необхідно. Без Jquery розробка складних інтерфейсів займала значно більше часу.

Чому сьогодні Jquery більше не потрібна

Сучасні браузери повністю підтримують нативний JavaScript. З’явилися:

• Fetch API замість $.ajax
• querySelector / querySelectorAll замість $()
• classList для керування класами
• addEventListener з делегуванням
• CSS-анімації та transition замість JS-анімацій
• Сучасні стандарти ES6+

Те, що раніше вимагало сторонньої бібліотеки, тепер вбудовано в саму мову та підтримується на 100% у всіх актуальних браузерах.

Додаткова бібліотека стала надлишковим навантаженням:

• Збільшує розмір сторінки
• Сповільнює завантаження
• Створює ризик конфліктів з іншими скриптами
• Ускладнює підтримку

Масштаб виконаної роботи

Команда BooStore.pro провела величезний обсяг рефакторингу. Було повністю переписано:

• Адміністративну панель
• Системні віджети
• Фільтри каталогу
• Модальні вікна
• AJAX-механізми
• Інтерактивні елементи шаблонів

Увесь код переведено на чистий Vanilla JavaScript без використання сторонніх фреймворків. Це дозволило:

• Знизити навантаження на клієнтську частину
• Прискорити роботу інтерфейсу
• Підвищити сумісність
• Спрощити підтримку та масштабування

Важливо

Jquery повністю видалено з ядра системи.

Підключайте бібліотеку лише у крайньому разі — якщо потрібно запустити старий сторонній плагін, який не має аналога на чистому JS.

В усіх інших випадках наполегливо рекомендується використовувати Vanilla JavaScript.

Як підключити Jquery за потреби

Якщо з об’єктивних причин бібліотека все ж потрібна:

1. Створіть Блок або Меню
2. Розмістіть його у «Службових тегах»
3. Встановіть виведення на всіх сторінках
4. Додайте наступний код:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>

Перехід з Jquery на Native JavaScript

// Jquery

$(".my-class");

// Native JS

document.querySelectorAll(".my-class");

// Jquery

$(document).on("click", ".btn", function() { ... });

// Native JS

document.addEventListener("click", function(e) {

if (e.target.closest(".btn")) { ... }

});

// Jquery

$.ajax({
url: "/api",
method: "POST",
data: { id: 1 }
});

// Native JS

fetch("/api", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ id: 1 })
}).then(response => response.json());

// Jquery

$(el).attr("data-src");

// Native JS

el.getAttribute("data-src");

// Jquery

$(el).addClass("active");

// Native JS

el.classList.add("active");

// Jquery

$(el).toggle();

// Native JS

el.style.display = (window.getComputedStyle(el).display === "none") ? "block" : "none";

Чому відмова від Jquery — стратегічно важлива

Сучасний веб розвивається у напрямку продуктивності, мінімалізму та нативних стандартів. Відмова від застарілих залежностей означає:

• Кращі показники Core Web Vitals
• Вищу швидкість завантаження
• Менше конфліктів і багів
• Чисту архітектуру проєкту
• Готовність до подальшого масштабування

Сьогодні Vanilla JavaScript повністю покриває всі потреби — від складних AJAX-механізмів до динамічного UI та інтерактивних інтерфейсів.

BooStore.pro зробили технологічний крок уперед, повністю оновивши фронтенд-архітектуру платформи. Це інвестиція в продуктивність, стабільність і майбутнє системи.

Підсумок

Jquery відіграла важливу роль у розвитку вебу. Але її час минув.

BooStore.pro повністю перейшли на чистий JavaScript, забезпечивши сучасний, швидкий і технологічно актуальний стандарт роботи сайтів.

Використовуйте Vanilla JS — це швидше, безпечніше та професійніше.

На BooStore.pro оновлено редактор TinyMCE 8 та інші системні плагіни

Дані оновлення — це ще один крок до максимально швидкого та сучасного BooStore.pro. Ми продовжуємо оптимізувати код, роблячи платформу легшою та технологічнішою.

На платформі BooStore.pro замінено jQuery FlexSlider на чистий JavaScript

На BooStore.pro виконано перехід слайдера на власний програмний компонент — HotengineSwiper. Це рішення прийшло на зміну застарілому jQuery FlexSlider у межах стратегії повної відмови від важких зовнішніх залежностей.

Ключові переваги HotengineSwiper:

• Продуктивність: Відсутність залежності від jQuery дозволила скоротити час ініціалізації скрипта та зменшити загальну вагу сторінки.
• Покращений UX: Компонент написаний на Vanilla JS з використанням сучасних Pointer Events, що забезпечує стабільний тач-інтерфейс і плавний свайп на мобільних пристроях.
• Оптимізація завантаження: Впроваджено нативну підтримку Lazy Load та динамічний перерахунок висоти контейнера, що запобігає «стрибкам» верстки та економить трафік.
• SEO-ефективність: Чистий код і висока швидкість відмальовування слайдів безпосередньо покращують показники Core Web Vitals, що критично важливо для пошукового просування.

HotengineSwiper — це швидший, легший і функціональніший інструмент, адаптований до сучасних стандартів веброзробки та вимог пошукових систем.

Перехід з Jquery jGrowl на власний модуль hotengine_notify

У рамках стратегії підвищення продуктивності було здійснено повну заміну JQuery jGrowl на чистий JavaScript.

Новий модуль hotengine_notify — це наше власне рішення, яке повністю зберігає звичну логіку сповіщень, але позбавляє проект від зайвих залежностей та важких бібліотек.

Що змінилося?

• Швидкість: Відсутність JQuery робить ініціалізацію сповіщень миттєвою.
• Вага: Код модуля зменшено у кілька разів порівняно з оригінальним плагіном.
• Нативність: Повна підтримка сучасних стандартів ES6+.

hotengine_notify('Зміни успішно збережено');

hotengine_notify('Помилка доступу до розділу', { 
    header: 'Системне переривання', 
    theme: 'error', 
    sticky: true 
});

hotengine_notify('У вас нове сповіщення', { 
    beforeClose: function(el, msg) {
        // Приклад: ставимо куку про прочитання на 24 години
        document.cookie = "notify_read=1; path=/; max-age=86400;";
    }
});

BooStore.pro — працюємо над швидкістю, щоб ви працювали над результатом.

Оновлення глобальних скриптів і перехід на чистий JavaScript

У межах глобального оновлення всі основні скрипти сайтів платформи BooStore.pro були переписані так, щоб працювати практично без використання бібліотеки jQuery.

Переваги такого підходу:

• Зменшення ваги сторінки: немає потреби завантажувати всю бібліотеку jQuery, що зменшує розмір скриптів і пришвидшує відображення сторінок.
• Підвищення продуктивності: нативний JavaScript працює швидше, особливо на мобільних пристроях і слабких браузерах.
• Контроль залежностей: кожен скрипт підключається лише за потреби.
• Гнучкість і масштабованість: код легко адаптується під нові функції без прив’язки до конкретної версії jQuery.

Поточна реалізація:

• В адмін-центрі jQuery і надалі підключається автоматично для підтримки застарілих плагінів.
• На фронтенді сайти тепер можуть повністю працювати на чистому JavaScript.
• Усі бібліотеки та додаткові скрипти завантажуються динамічно, на льоту, під конкретні завдання користувача, без попереднього завантаження великих файлів.

Основні оновлення:

• Спливаючі вікна та конструктор форм повністю переписані на нативний JS.
• Віджети товарів: слайдер товарів, режим свайпу, прокрутка пальцем і динамічне підвантаження контенту під час скролінгу.
• Меню: оновлено скрипти головного меню та простого мобільного меню.
• Оновлено скрипти сортування товарів.
• Кошик і додавання товарів:
  • Оновлено модуль додавання товарів до кошика.
  • Оновлено спінер і перемикач кількості товарів для додавання до кошика.
  • Оновлено скрипт відображення варіантів товарів у списках і під час редагування за допомогою миші.
  • Оновлено скрипт відображення товарів, доданих до кошика (спливаюче вікно при наведенні курсора на іконку кошика).
• AJAX-запити повністю переписані на стандартний JavaScript для завантаження сторінок, товарів, статей, форм і коментарів.

Плани на майбутнє:

• Поступовий перехід до повністю модульної архітектури без jQuery із збереженням сумісності з адміністративним інтерфейсом.
• Оскільки багато користувачів застосовують власні скрипти на jQuery, буде запроваджено глобальне налаштування для підключення бібліотеки до сайту за потреби.

Оновлення віджета мобільного меню на BooStore.pro: повна відмова від jQuery

На платформі BooStore.pro було оновлено віджет мобільного меню. Головна зміна полягає у повній відмові від бібліотеки jQuery. Тепер усі елементи меню та інтерактивні функції реалізовані на чистому JavaScript.

Це рішення має кілька ключових переваг:

• Прискорення завантаження сторінок. Раніше меню чекало на завантаження jQuery, що уповільнювало відображення елементів на мобільних пристроях. Перехід на нативний JavaScript усуває це очікування, роблячи меню миттєво реагуючим.
• Повна відмова від $.cookie. Для зберігання налаштувань користувача та стану меню більше не використовується бібліотека jQuery Cookie. Всі куки та локальне сховище обробляються стандартними методами JavaScript.
• Сучасні підходи до DOM. Відкриття та закриття меню, перемикання вкладок та обробка подій тепер виконуються через стандартні методи DOM API, що підвищує стабільність та сумісність із різними пристроями та браузерами.

В результаті оновлення мобільне меню стало швидшим, надійнішим і повністю незалежним від сторонніх бібліотек, що покращує користувацький досвід і прискорює роботу сайту на всіх пристроях.

Оновлено бібліотеки JavaScript на BooStore.pro

Ми повністю оновили всі бібліотеки JavaScript на сайті, щоб інтерфейс працював швидше та стабільніше.

Основні зміни:

• Нова легка галерея зображень: замінили Colorbox (16 KB) на SimpleLightbox (7 KB) – повністю незалежна галерея на JavaScript. Це зменшує навантаження на сторінку, прискорює завантаження та робить галерею незалежною від фреймворку jQuery.
• Повна заміна застарілих методів запитів: всі виклики $.ajax, $.get та $.post були замінені на стандартний fetch API. Це оновлення необхідне для переходу на jQuery 4 та поступового відходу від залежності від цієї бібліотеки.

Переваги переходу на fetch:

• Менше залежностей: jQuery більше не потрібен для асинхронних запитів.
• Сучасний стандарт: fetch вбудований у всі сучасні браузери і підтримує promises, що спрощує обробку результатів та помилок.
• Підтримка AbortController: легко реалізувати таймаути та скасування запитів, покращуючи відгук інтерфейсу.
• Краща оптимізація та швидкість: сторінки завантажуються швидше, оскільки зменшується обсяг коду та спрощується потік даних між сервером і клієнтом.

Оновлення роблять BooStore.pro швидшим, надійнішим та зручнішим для всіх користувачів. Слідкуйте за нашими новими покращеннями!

Важливе оновлення на BooStore.pro: усі сайти тепер з SSL!

Раді повідомити, що тепер усі сайти на платформі BooStore.pro за замовчуванням працюють через безпечне з'єднання HTTPS. Кожен сайт отримує SSL-сертифікат, що підвищує захист даних користувачів та зміцнює довіру до вашого ресурсу.

Це оновлення — важливий крок у підвищенні безпеки та надійності сайтів на нашій платформі. Вам не потрібно нічого додатково робити — ми автоматично налаштували сертифікати для всіх доменів та піддоменів.

Тепер ваші відвідувачі можуть бути впевнені, що їхні дані захищені, а пошукові системи сприймають ваш сайт як безпечний та сучасний ресурс.

BooStore.pro продовжує покращувати платформу для вашої зручності та безпеки!

Нова опція націнок у рекламних вивантаженнях BooStore.pro

У системі BooStore.pro додана нова опція керування націнками для рекламних XML-вивантажень (Google Merchant, Rozetka, Prom.ua, Epicentrk.ua та інших).

Тепер ви можете гнучко контролювати, які націнки будуть застосовуватися під час формування вивантажень, або повністю їх вимикати.

Доступні можливості

• повністю вимкнути всі націнки та вивантажувати оригінальну ціну товару;
• вимкнути націнки лише для окремих рекламних майданчиків (Rozetka, Prom.ua, Epicentrk.ua);
• вимкнути лише формульні націнки, зберігши інші правила ціноутворення;
• використовувати стандартні націнки без змін (режим за замовчуванням) — тобто ті націнки, які заздалегідь налаштовані для кожної категорії у конкретному вивантаженні.

** — на BooStore.pro ви можете задавати індивідуальні правила націнок для кожної категорії та кожної рекламної платформи окремо, наприклад для Rozetka, Epicentrk.ua або Prom.ua.

Це дозволяє максимально точно налаштовувати ціни під вимоги конкретних рекламних каналів, уникати зайвих націнок та підвищувати конкурентоспроможність пропозицій.

Нова опція вже доступна в налаштуваннях рекламних вивантажень і не потребує додаткових доопрацювань.

Нове розташування блоку меню

У BooStore.pro додано нове розташування існуючого блоку меню — у верхній частині сторінки, але під деревом категорій.

Таке розташування призначене для елементів керування, які логічно розміщувати одразу після дерева категорій та перед основним списком товарів.

• сортування товарів
• додаткові параметри відображення каталогу
• службові елементи навігації

Оновлення у віджетах BooStore.pro: нові правила завантаження скриптів

На BooStore.pro відбулося важливе оновлення для всіх віджетів з товарами, категоріями та виробниками. Раніше параметр :htmlonly використовувався для відключення завантаження скриптів та стилів. Тепер його замінено новим параметром :add-javascript, але з протилежною логікою.

Що це означає:

• Раніше :htmlonly відключав підвантаження скриптів (корисно, якщо ви хотіли реалізувати власний скрипт випадаючого меню, стилі або інші функції).
• Тепер :add-javascript працює навпаки — при його використанні скрипти та стилі підвантажуються автоматично.
• Всі функції віджетів залишилися без змін, змінилася лише логіка підключення скриптів.

Важливо:

На всіх сторінках та у всіх блоках/меню, де раніше віджет використовувався без параметра :htmlonly, він автоматично доповнено параметром :add-javascript. Це означає, що скрипти віджетів тепер підвантажуються коректно без додаткового ручного налаштування.

Додано платіжну систему Hutko (з підтримкою багатьох мов, валют та способів оплати).

BooStore.pro покращує завантаження скриптів: відмова від $.getScript

Команда BooStore.pro оптимізувала роботу JavaScript на платформі, замінивши $.getScript на динамічне створення елементів <script> за допомогою чистого JavaScript.

Раніше скрипт підвантажувався так:

$(function(){
if ($(".hotengine-shop-products-add-count-spinner").length){
         if(typeof $hotengine_shop_product_count_spinner == "undefined"){
		        $.getScript("/templates/scripts/hotengine-script-shop-product-count-spinner.js?v33").fail(function(jqxhr, settings, exception) { console.error("Failed to load script: ", exception);
                });
		 }
} 
});

Тепер використовується інший підхід:

$(function(){
    if ($(".hotengine-shop-products-add-count-spinner").length){
        if (typeof $hotengine_shop_product_count_spinner == "undefined"){
            const s = document.createElement("script");
            s.async = true;
            s.src = "/templates/scripts/hotengine-script-shop-product-count-spinner.js?v34";
            s.onerror = (e) => { console.error(`Failed to load script: ${s.src}`, e); };
            document.head.appendChild(s);
        }
    }
});

Чому це рекомендується:

• Не потрібен jQuery, менше залежностей.
• Контроль повторного завантаження: скрипт вставляється лише один раз.
• Асинхронне завантаження покращує продуктивність без блокування сторінки.
• Просте та передбачуване оброблення помилок через onerror.
• Код більш сучасний та сумісний з чистим JavaScript.

Додано завантаження різновидів товарів через Ajax + JSON

На BooStore.pro реалізовано новий спосіб відображення різновидів товарів у списку — завантаження «на льоту» з використанням технологій Ajax та JSON. Це дозволяє суттєво зменшити навантаження на сайт і прискорити початкове завантаження сторінки.

Тепер варіанти товарів можуть підвантажуватися динамічно: при натисканні кнопки «Купити» / «Обрати» або при наведенні курсора миші. Такий підхід не створює додаткового серверного навантаження та є оптимальним для більшості магазинів із великим асортиментом.

Важливо: також доступний платний метод, за якого різновиди товарів відображаються одразу у списку товарів. Цей варіант потребує оплати розширеної вигрузки, оскільки збільшує навантаження на сайт через постійне завантаження всіх варіантів.

Під час використання Ajax-завантаження слід враховувати, що у товарних слайдерах і віджетах з динамічною прокруткою можливі складнощі з коректним відображенням варіантів. Тому цей спосіб рекомендується застосовувати під час стандартного перегляду списку товарів, а не всередині слайдерів або товарних віджетів.

На BooStore.pro додано тестування відправки повідомлень на Viber і Telegram

Тепер ви можете протестувати відправку сповіщень через Viber і Telegram прямо з панелі керування.
Також з’явилась можливість видаляти підписників без необхідності змінювати ключ доступу.

Нова можливість: конвертація зображень у WebP

На платформі SAAS BooStore.pro додано функцію конвертації зображень при завантаженні товарів у формат WebP. Цей формат забезпечує швидше відображення та краще стиснення зображень, що рекомендується для оптимізації швидкості сайту.

Конвертація доступна як при ручному завантаженні товарів, так і при автоматичному імпорті. Для увімкнення конвертації достатньо встановити прапорець «Конвертувати в Webp» при завантаженні зображень.

Тепер ваші товари будуть завантажуватися у сучасному форматі зображень без необхідності попередньої конвертації файлів, що прискорює роботу сайту та підвищує зручність для користувачів.

У головному меню з’явилася можливість вибору виробників

Тепер у віджеті головного меню доступний новий функціонал — випадаючий список виробників. Це дозволить швидше обирати потрібний бренд та переходити безпосередньо до його товарів.

Додано можливість встановлювати маленьку іконку для Категорій, Виробників і Колекцій магазину

Окрім великих іконок (які відображаються всередині сторінки при відкритті категорії), тепер доступна окрема маленька іконка, що показується у всіх меню — у головному меню, випадаючих списках та мобільному меню:

• Маленькі іконки з вбудованої бібліотеки — доступні кольорові та однотонні (масковані) SVG;
• Для однотонних SVG можна задавати власний колір (через CSS/атрибут або через інтерфейс налаштувань);
• Підтримується завантаження власних файлів у форматах SVG, WEBP, PNG, JPG;

Це дозволяє відображати впізнавані маленькі іконки поруч з пунктами меню, що покращує зручність навігації та візуальне сприйняття каталогу.