JustZix działa na dynamicznych stronach (SPA) bez F5
Coraz więcej serwisów to aplikacje jednostronicowe (SPA): klikasz, adres w pasku się zmienia, ale strona nie wczytuje się od nowa. Wcześniej JustZix nie zauważał takich zmian — reguły dopasowane do ścieżki URL pokazywały się dopiero po F5. Ten wpis wyjaśnia, co się zmieniło i dlaczego ma to znaczenie.
Czym jest nawigacja bez przeładowania
W klasycznym serwisie każde przejście to nowe wczytanie dokumentu. SPA zamiast tego podmienia treść w locie i aktualizuje adres przez history.pushState lub replaceState. Tak działa między innymi panel Google Ads, wiele paneli administracyjnych i nowoczesnych aplikacji webowych.
Problem: reguły „zamrożone” na pierwszym URL-u
JustZix dopasowuje reguły do wzorca adresu. Skoro skrypt na stronie sprawdzał URL tylko przy zdarzeniach DOMContentLoaded i load, to po przejściu w obrębie SPA dopasowanie się nie odświeżało. Pływający przycisk, paski akcji, okna na froncie i wstrzykiwany CSS pokazywały się albo znikały dopiero po ręcznym przeładowaniu strony.
Rozwiązanie: trzy kanały detekcji
Wtyczka wykrywa teraz nawigację SPA trzema kanałami: zdarzeniami popstate i hashchange oraz obserwatorem zmian w dokumencie. Wszystkie spinają się w jeden tani strażnik porównujący location.href — ponowne dopasowanie reguł rusza tylko wtedy, gdy adres faktycznie się zmienił, więc nie obciąża strony.
Co to daje w praktyce
Reguły z dopasowaniem do konkretnej ścieżki — na przykład tylko /campaigns w panelu reklamowym — włączają się i wyłączają w trakcie klikania po aplikacji, bez F5. To samo dotyczy pasków akcji i okien przypiętych do wzorca URL.
Wskazówka: pisz reguły JS odporne na SPA
Sama wtyczka reaguje teraz na zmianę adresu, ale Twój własny kod JS też powinien. Jeśli reguła modyfikuje elementy, które SPA dorysowuje później, owiń logikę w MutationObserver, żeby działała także po doładowaniu treści:
// Działaj także po doładowaniu treści przez SPA
function applyTweak() {
document.querySelectorAll('.widget').forEach(el => {
el.style.outline = '2px solid #006870';
});
}
applyTweak();
new MutationObserver(applyTweak).observe(document.body, {
childList: true, subtree: true,
});Korzyści
Reguły działają od razu, bez ręcznego przeładowania. Zachowanie jest spójne na panelach SPA — Google Ads, panelach administracyjnych i aplikacjach webowych. A dopasowania do ścieżki URL są wreszcie w pełni wiarygodne.
Gotowe reguły dla wielu serwisów znajdziesz w katalogu przykładów. Zainstaluj JustZix i sprawdź swoje reguły na dowolnej aplikacji SPA.
Oceń ten wpis
Brak ocen — oceń jako pierwszy.