Это не просто скрипт, а архитектурное мышление. Тут реально есть о чём поговорить.
В чём здесь главная идея (если разложить по полочкам)
Обычные скрипты:
1. что-то показали
2. умерли
Мой подход:
1. состояние живёт дольше страницы
2. скрипт помнит прошлое
3. сравнивает было и стало
4. реагирует только на изменения
Это уже не JS-скрипт, а мини-движок состояния.
Ключевое тут STATEFUL SCRIPT
фактически: клиентский state-менеджер без фреймворков..
Что есть:
1. persistent state (localStorage)
2. silent sync (фоновые проверки)
3. diff-логика (через hash)
4. lazy-update (обновление только при изменениях)
5. zero-backend (без PHP / API)
Это те же принципы, что:
1. React (virtual DOM diff)
2. Redux (single source of truth)
3. Service Workers (cache + sync)
4. PWA offline-first
Просто без всего этого зоопарка.
Почему такие скрипты заменяют модули
Модуль обычно:
1. грузит кучу PHP
2. дергает БД
3. обновляет всё подряд
4. конфликтует с другими
А мой скрипт:
1. ничего не ломает
2. живёт автономно
3. не зависит от чужого кода
4. не трогает сервер лишний раз
5. масштабируется горизонтально
Можно добавить 10 таких логик и они не будут мешать друг другу, если правильно организованы.
Это мышление:
1. системного разработчика
2. архитектора фронта
3. человека, который понимает, почему сайты тормозят
И да на старых платформах (uCoz, DLE, PHP-CMS) такие вещи особенно ценны, потому что:
1. сервер менять нельзя
2. backend ограничен
JS единственный рычаг
Пример вытаскиваем подпись
Код
<script>
document.addEventListener("DOMContentLoaded", function () {
var userId = "$USER_ID$";
if (!userId || userId === "0") return;
var PROFILE_URL = "/index/8-" + userId;
var MAX_LETTERS = 121;
/* ===== KEYS ===== */
var SIG_KEY = "usig_" + userId;
var SIG_HASH = "usig_hash_" + userId;
var CITY_KEY = "ucity_" + userId;
var CITY_HASH = "ucity_hash_" + userId;
/* ===== 1. МГНОВЕННЫЙ ВЫВОД ИЗ localStorage ===== */
var cachedSig = localStorage.getItem(SIG_KEY);
if (cachedSig) renderSignature(cachedSig);
var cachedCity = localStorage.getItem(CITY_KEY);
if (cachedCity) renderCity(cachedCity);
/* ===== 2. ТИХАЯ ПРОВЕРКА ПРОФИЛЯ ===== */
fetch(PROFILE_URL, { credentials: "same-origin" })
.then(r => r.text())
.then(html => {
var doc = new DOMParser().parseFromString(html, "text/html");
/* --- ПОДПИСЬ --- */
var newSig = extractSignature(doc);
if (newSig) {
var sigHashNew = makeHash(newSig);
var sigHashOld = localStorage.getItem(SIG_HASH);
if (sigHashNew !== sigHashOld) {
localStorage.setItem(SIG_KEY, newSig);
localStorage.setItem(SIG_HASH, sigHashNew);
renderSignature(newSig);
}
}
/* --- ГОРОД --- */
var newCity = extractCity(doc);
if (newCity) {
var cityHashNew = makeHash(newCity);
var cityHashOld = localStorage.getItem(CITY_HASH);
if (cityHashNew !== cityHashOld) {
localStorage.setItem(CITY_KEY, newCity);
localStorage.setItem(CITY_HASH, cityHashNew);
renderCity(newCity);
}
}
})
.catch(() => {});
/* ===== ПАРСЕРЫ ===== */
function extractSignature(doc) {
var sig = "";
doc.querySelectorAll(".profile-section").forEach(section => {
var title = section.querySelector(".profile-section-name");
if (title && title.textContent.trim() === "Подпись (о себе)") {
var content = section.querySelector(".profile-section-content");
if (content) sig = content.textContent.trim();
}
});
return sig;
}
function extractCity(doc) {
var city = "";
doc.querySelectorAll(".profile-row").forEach(row => {
var name = row.querySelector(".profile-row-name");
if (name && name.textContent.trim() === "Город:") {
var content = row.querySelector(".profile-row-content");
if (content) city = content.textContent.trim();
}
});
return city;
}
/* ===== РЕНДЕР ===== */
function renderSignature(sig) {
if (sig.length > MAX_LETTERS) {
sig = sig.slice(0, MAX_LETTERS) + "…";
}
var el = document.getElementById("profileSignature");
if (!el) return;
el.querySelector(".signature-text-main").textContent = sig;
el.style.display = "block";
}
function renderCity(city) {
var el = document.getElementById("profileCity");
if (!el) return;
el.querySelector(".city-text-main").textContent = city;
el.style.display = "flex";
}
/* ===== HASH ===== */
function makeHash(str) {
var hash = 0;
for (var i = 0; i < str.length; i++) {
hash = ((hash << 5) - hash) + str.charCodeAt(i);
hash |= 0;
}
return hash.toString();
}
});
</script>
Почему это идеальный вариант для uCoz
1. Один запрос к профилю
2. Мгновенный вывод из памяти
4. Обновление только при реальных изменениях
5. Никаких таймеров, лагов, миганий
6. Подпись и город синхронизированы
7. Готово к расширению (статус, возраст, аватар)
Логику можно использовать во всех направлениях в системе uCoz , и она будет работать.
