@erickxavier/no-js 1.9.1 → 1.10.1

package/src/directives/state.js

@@ -2,7 +2,7 @@
 //  DIRECTIVES: state, store, computed, watch
 // ═══════════════════════════════════════════════════════════════════════
 
-import { _stores, _log, _watchExpr } from "../globals.js";
+import { _stores, _log, _warn, _watchExpr } from "../globals.js";
 import { createContext } from "../context.js";
 import { evaluate, _execStatement } from "../evaluate.js";
 import { findContext } from "../dom.js";
@@ -12,14 +12,18 @@ import { _devtoolsEmit } from "../devtools.js";
 registerDirective("state", {
   priority: 0,
   init(el, name, value) {
-    const data = evaluate(value, createContext()) || {};
+    const initialState = evaluate(value, createContext()) || {};
     const parent = el.parentElement ? findContext(el.parentElement) : null;
-    const ctx = createContext(data, parent);
+    const ctx = createContext(initialState, parent);
     el.__ctx = ctx;
 
     // Persistence
     const persist = el.getAttribute("persist");
     const persistKey = el.getAttribute("persist-key");
+    if (persist && !persistKey) {
+      _warn(`persist="${persist}" requires a persist-key attribute. State will not be persisted.`);
+      return;
+    }
     if (persist && persistKey) {
       const store =
         persist === "localStorage"
@@ -28,21 +32,47 @@ registerDirective("state", {
             ? sessionStorage
             : null;
       if (store) {
+        const persistFieldsAttr = el.getAttribute("persist-fields");
+        const persistFields = persistFieldsAttr
+          ? new Set(persistFieldsAttr.split(",").map((f) => f.trim()))
+          : null;
         try {
           const saved = store.getItem("nojs_state_" + persistKey);
           if (saved) {
             const parsed = JSON.parse(saved);
-            for (const [k, v] of Object.entries(parsed)) ctx.$set(k, v);
+            const schemaCheck = el.hasAttribute("persist-schema");
+            for (const [k, v] of Object.entries(parsed)) {
+              if (!persistFields || persistFields.has(k)) {
+                if (schemaCheck) {
+                  if (!(k in initialState)) { _warn('persist-schema: ignoring unknown key "' + k + '"'); continue; }
+                  if (initialState[k] !== null && v !== null && typeof v !== typeof initialState[k]) {
+                    _warn('persist-schema: type mismatch for "' + k + '" (expected ' + typeof initialState[k] + ', got ' + typeof v + ')');
+                    continue;
+                  }
+                }
+                ctx.$set(k, v);
+              }
+            }
           }
         } catch {
           /* ignore */
         }
+
+        // Warn about potentially sensitive field names in persisted state
+        const sensitiveNames = ['token', 'password', 'secret', 'key', 'auth', 'credential', 'session'];
+        const stateKeys = Object.keys(initialState);
+        const riskyKeys = stateKeys.filter(k => sensitiveNames.some(s => k.toLowerCase().includes(s)));
+        if (riskyKeys.length > 0) {
+          _warn('State key(s) ' + riskyKeys.map(k => '"' + k + '"').join(', ') + ' may contain sensitive data. Consider using persist-fields to exclude them.');
+        }
+
         ctx.$watch(() => {
           try {
-            store.setItem(
-              "nojs_state_" + persistKey,
-              JSON.stringify(ctx.__raw),
-            );
+            const raw = ctx.__raw;
+            const data = persistFields
+              ? Object.fromEntries(Object.entries(raw).filter(([k]) => persistFields.has(k)))
+              : raw;
+            store.setItem("nojs_state_" + persistKey, JSON.stringify(data));
           } catch {
             /* ignore */
           }
@@ -50,7 +80,7 @@ registerDirective("state", {
       }
     }
 
-    _log("state", data);
+    _log("state", initialState);
   },
 });
 

package/src/directives/styling.js

@@ -55,7 +55,7 @@ registerDirective("class-*", {
       el.classList.toggle(suffix, !!evaluate(expr, ctx));
     }
     _watchExpr(expr, ctx, update);
-    if (expr.includes("$i18n") || expr.includes("NoJS.locale")) _watchI18n(update);
+    if (expr.includes("$i18n") || expr.includes("NoJS.locale") || expr.includes("window.NoJS.locale")) _watchI18n(update);
     update();
   },
 });

package/src/dom.js

@@ -33,14 +33,51 @@ export function _cloneTemplate(id) {
   return tpl.content ? tpl.content.cloneNode(true) : null;
 }
 
-// Simple HTML sanitizer
+// Structural HTML sanitizer — uses DOMParser to parse the markup before cleaning.
+// Regex-based sanitizers are bypassable via SVG/MathML event handlers, nested
+// srcdoc attributes, and HTML entity encoding (e.g. javascript:).
+// DOMParser resolves entities and builds a real DOM tree, making all vectors
+// uniformly detectable by a single attribute-name/value check.
+//
+// Custom hook: set _config.sanitizeHtml to a function to plug in an external
+// sanitizer (e.g. DOMPurify) without bundling it as a hard dependency.
+const _BLOCKED_TAGS = new Set([
+  'script', 'style', 'iframe', 'object', 'embed',
+  'base', 'form', 'meta', 'link', 'noscript',
+]);
+
 export function _sanitizeHtml(html) {
-  if (!_config.sanitize) return html;
-  const safe = html
-    .replace(/<script[\s\S]*?<\/script>/gi, "")
-    .replace(/on\w+\s*=/gi, "data-blocked=")
-    .replace(/javascript:/gi, "");
-  return safe;
+  if (_config.dangerouslyDisableSanitize || !_config.sanitize) {
+    _warn('HTML sanitization is DISABLED. This exposes your app to XSS attacks. Only disable for trusted content.');
+    return html;
+  }
+  if (typeof _config.sanitizeHtml === 'function') return _config.sanitizeHtml(html);
+
+  const doc = new DOMParser().parseFromString(html, 'text/html');
+
+  function _clean(node) {
+    for (const child of [...node.childNodes]) {
+      if (child.nodeType !== 1) continue; // text and comment nodes are safe
+      if (_BLOCKED_TAGS.has(child.tagName.toLowerCase())) {
+        child.remove();
+        continue;
+      }
+      for (const attr of [...child.attributes]) {
+        const n = attr.name.toLowerCase();
+        const v = attr.value.toLowerCase().trimStart();
+        const isUrlAttr = n === 'href' || n === 'src' || n === 'action' || n === 'xlink:href';
+        const isDangerousScheme = v.startsWith('javascript:') || v.startsWith('vbscript:');
+        const isDangerousData = isUrlAttr && v.startsWith('data:') && !/^data:image\//.test(v);
+        if (n.startsWith('on') || isDangerousScheme || isDangerousData) {
+          child.removeAttribute(attr.name);
+        }
+      }
+      _clean(child);
+    }
+  }
+
+  _clean(doc.body);
+  return doc.body.innerHTML;
 }
 
 // Resolve a template src path.
@@ -64,6 +101,18 @@ function _resolveTemplateSrc(src, tpl) {
   return resolveUrl(src, tpl);
 }
 
+// Warn when a template URL uses plain HTTP from an HTTPS page (mixed content / MITM risk).
+// The optional pageProtocol parameter enables testing without mutating jsdom's
+// non-configurable window.location.protocol property.
+export function _warnIfInsecureTemplateUrl(resolvedUrl, src, pageProtocol) {
+  const proto = pageProtocol !== undefined
+    ? pageProtocol
+    : (typeof window !== 'undefined' && window.location ? window.location.protocol : '');
+  if (resolvedUrl.startsWith('http://') && proto === 'https:') {
+    _warn('Template "' + src + '" is loaded over insecure HTTP from an HTTPS page. Use HTTPS to prevent tampering.');
+  }
+}
+
 export async function _loadRemoteTemplates(root) {
   const scope = root || document;
   const templates = scope.querySelectorAll("template[src]");
@@ -74,6 +123,7 @@ export async function _loadRemoteTemplates(root) {
     tpl.__srcLoaded = true;
     const src = tpl.getAttribute("src");
     const resolvedUrl = _resolveTemplateSrc(src, tpl);
+    _warnIfInsecureTemplateUrl(resolvedUrl, src);
     // Track the folder of this template so children can use "./" paths
     const baseFolder = resolvedUrl.substring(0, resolvedUrl.lastIndexOf("/") + 1);
     try {
@@ -129,6 +179,7 @@ export async function _loadTemplateElement(tpl) {
   _log("[LTE] START fetch:", src, "| route:", tpl.hasAttribute("route"), "| inDOM:", document.contains(tpl), "| loading:", tpl.getAttribute("loading"));
   tpl.__srcLoaded = true;
   const resolvedUrl = _resolveTemplateSrc(src, tpl);
+  _warnIfInsecureTemplateUrl(resolvedUrl, src);
   const baseFolder = resolvedUrl.substring(0, resolvedUrl.lastIndexOf("/") + 1);
 
   // Synchronously insert loading placeholder before the fetch begins

package/src/evaluate.js

@@ -2,12 +2,36 @@
 //  EXPRESSION EVALUATOR
 // ═══════════════════════════════════════════════════════════════════════
 
-import { _stores, _routerInstance, _filters, _warn, _notifyStoreWatchers } from "./globals.js";
+import { _config, _stores, _routerInstance, _filters, _warn, _notifyStoreWatchers } from "./globals.js";
 import { _i18n } from "./i18n.js";
 import { _collectKeys } from "./context.js";
 
-const _exprCache = new Map();
-const _stmtCache = new Map();
+function _makeCache() {
+  const map = new Map();
+  return {
+    get(k) {
+      if (!map.has(k)) return undefined;
+      // Move to end so this entry is the most-recently-used
+      const v = map.get(k);
+      map.delete(k);
+      map.set(k, v);
+      return v;
+    },
+    has(k) { return map.has(k); },
+    set(k, v) {
+      const max = _config.exprCacheSize;
+      if (map.has(k)) {
+        map.delete(k); // refresh position before re-inserting
+      } else if (map.size >= max) {
+        map.delete(map.keys().next().value); // evict LRU (insertion-order first)
+      }
+      map.set(k, v);
+    },
+    get size() { return map.size; },
+  };
+}
+export const _exprCache = _makeCache();
+export const _stmtCache = _makeCache();
 
 // ── Tokenizer ──────────────────────────────────────────────────────────
 
@@ -707,7 +731,149 @@ const _SAFE_GLOBALS = {
   Error, Symbol, console,
 };
 
-const _DENY_GLOBALS = { eval: 1, Function: 1, process: 1, require: 1, importScripts: 1 };
+// Explicit allow-list for browser globals accessible in template expressions.
+// Using an allow-list (opt-in) rather than a deny-list (opt-out) ensures that
+// network and storage APIs — fetch, XMLHttpRequest, localStorage, sessionStorage,
+// WebSocket, indexedDB — are unreachable from template code by default, closing
+// the surface where interpolated external data could trigger unintended requests.
+// window, document, and location are further wrapped in Proxy objects below
+// to block sensitive sub-properties (fetch, cookie, navigation, etc.).
+
+// ── Security proxies for window, document, and location ─────────────────
+// Even though window/document are on the allow-list, we wrap them in Proxy
+// objects that block access to sensitive sub-properties (network, storage,
+// cookie, eval, etc.) while still allowing safe DOM / measurement APIs.
+
+const _BLOCKED_WINDOW_PROPS = new Set([
+  'fetch', 'XMLHttpRequest', 'localStorage', 'sessionStorage',
+  'WebSocket', 'indexedDB', 'eval', 'Function', 'importScripts',
+  'open', 'postMessage',
+]);
+// Props on window that must return safe proxies instead of raw objects
+const _WINDOW_PROXY_OVERRIDES = {}; // populated after proxy creation below
+
+const _BLOCKED_DOCUMENT_PROPS = new Set([
+  'cookie', 'domain', 'write', 'writeln', 'execCommand',
+]);
+
+const _safeWindow = typeof globalThis !== 'undefined' && typeof globalThis.window !== 'undefined'
+  ? new Proxy(globalThis.window, {
+      get(target, prop, receiver) {
+        if (typeof prop === 'string' && _BLOCKED_WINDOW_PROPS.has(prop)) return undefined;
+        if (typeof prop === 'string' && prop in _WINDOW_PROXY_OVERRIDES) return _WINDOW_PROXY_OVERRIDES[prop];
+        return Reflect.get(target, prop, receiver);
+      },
+      set(target, prop, value) {
+        // Block writes to dangerous window properties from expressions;
+        // allow writing user-defined properties (e.g. window.__myHelper)
+        if (typeof prop === 'string' && _BLOCKED_WINDOW_PROPS.has(prop)) return true;
+        if (prop === 'name' || prop === 'status') return true; // anti-exfiltration
+        target[prop] = value;
+        return true;
+      },
+    })
+  : undefined;
+
+const _safeDocument = typeof globalThis !== 'undefined' && typeof globalThis.document !== 'undefined'
+  ? new Proxy(globalThis.document, {
+      get(target, prop, receiver) {
+        if (typeof prop === 'string' && _BLOCKED_DOCUMENT_PROPS.has(prop)) return undefined;
+        if (prop === 'defaultView') return _safeWindow;
+        return Reflect.get(target, prop, receiver);
+      },
+      set(target, prop, value) {
+        if (typeof prop === 'string' && _BLOCKED_DOCUMENT_PROPS.has(prop)) return true;
+        target[prop] = value;
+        return true;
+      },
+    })
+  : undefined;
+
+// Read-only location wrapper — exposes common getters via a plain object with
+// property descriptors that read from the real location. Navigation methods are
+// replaced with no-ops. Using a plain object avoids Proxy invariant violations
+// on non-configurable properties (like location.assign).
+const _LOCATION_READ_PROPS = [
+  'href', 'pathname', 'search', 'hash', 'origin',
+  'hostname', 'port', 'protocol', 'host',
+];
+const _locationNoop = () => {};
+
+const _safeLocation = typeof globalThis !== 'undefined' && typeof globalThis.location !== 'undefined'
+  ? (() => {
+      const loc = {};
+      for (const prop of _LOCATION_READ_PROPS) {
+        Object.defineProperty(loc, prop, {
+          get() { return globalThis.location[prop]; },
+          set() { /* silently ignore writes */ },
+          enumerable: true, configurable: false,
+        });
+      }
+      loc.assign = _locationNoop;
+      loc.replace = _locationNoop;
+      loc.reload = _locationNoop;
+      loc.toString = () => globalThis.location.href;
+      return Object.freeze(loc);
+    })()
+  : undefined;
+
+// Read-only history wrapper — exposes state and length as read-only getters,
+// replaces navigation methods with no-ops. Prevents expressions from
+// manipulating browser history (pushState, back, forward, etc.).
+const _HISTORY_READ_PROPS = ['length', 'state', 'scrollRestoration'];
+
+const _safeHistory = typeof globalThis !== 'undefined' && typeof globalThis.history !== 'undefined'
+  ? (() => {
+      const h = {};
+      for (const prop of _HISTORY_READ_PROPS) {
+        Object.defineProperty(h, prop, {
+          get() { return globalThis.history[prop]; },
+          enumerable: true, configurable: false,
+        });
+      }
+      h.pushState = _locationNoop;
+      h.replaceState = _locationNoop;
+      h.back = _locationNoop;
+      h.forward = _locationNoop;
+      h.go = _locationNoop;
+      return Object.freeze(h);
+    })()
+  : undefined;
+
+// Navigator proxy — blocks sendBeacon (data exfiltration) and credentials
+const _BLOCKED_NAVIGATOR_PROPS = new Set(['sendBeacon', 'credentials']);
+const _safeNavigator = typeof globalThis !== 'undefined' && typeof globalThis.navigator !== 'undefined'
+  ? new Proxy(globalThis.navigator, {
+      get(target, prop, receiver) {
+        if (typeof prop === 'string' && _BLOCKED_NAVIGATOR_PROPS.has(prop)) return undefined;
+        return Reflect.get(target, prop, receiver);
+      },
+      set() { return true; }, // navigator props are browser-enforced read-only
+    })
+  : undefined;
+
+// Wire window.location → _safeLocation, window.document → _safeDocument,
+// window.history → _safeHistory, window.navigator → _safeNavigator
+// so accessing via the window proxy returns safe versions
+if (_safeLocation) _WINDOW_PROXY_OVERRIDES.location = _safeLocation;
+if (_safeDocument) _WINDOW_PROXY_OVERRIDES.document = _safeDocument;
+if (_safeHistory) _WINDOW_PROXY_OVERRIDES.history = _safeHistory;
+if (_safeNavigator) _WINDOW_PROXY_OVERRIDES.navigator = _safeNavigator;
+
+const _BROWSER_GLOBALS = new Set([
+  'window', 'document', 'console', 'location', 'history',
+  'navigator', 'screen', 'performance', 'crypto',
+  // setTimeout/setInterval allow deferred execution from template expressions;
+  // necessary for legitimate use cases (e.g. debounce patterns in event handlers).
+  'setTimeout', 'clearTimeout', 'setInterval', 'clearInterval',
+  'requestAnimationFrame', 'cancelAnimationFrame',
+  // alert/confirm/prompt are included for completeness and backward compatibility
+  // (e.g. confirm dialogs before delete). They are discouraged in production UIs —
+  // prefer custom modal components for a better user experience.
+  'alert', 'confirm', 'prompt',
+  'CustomEvent', 'Event', 'URL', 'URLSearchParams',
+  'FormData', 'FileReader', 'Blob', 'Promise',
+]);
 
 function _evalNode(node, scope) {
   try {
@@ -721,8 +887,14 @@ function _evalNode(node, scope) {
       case 'Identifier':
         if (node.name in scope) return scope[node.name];
         if (node.name in _SAFE_GLOBALS) return _SAFE_GLOBALS[node.name];
-        // Allow access to browser globals (window, document, etc.) for backward compat
-        if (typeof globalThis !== 'undefined' && node.name in globalThis && !_DENY_GLOBALS[node.name]) return globalThis[node.name];
+        if (_BROWSER_GLOBALS.has(node.name) && typeof globalThis !== 'undefined') {
+          if (node.name === 'window') return _safeWindow;
+          if (node.name === 'document') return _safeDocument;
+          if (node.name === 'location') return _safeLocation;
+          if (node.name === 'history') return _safeHistory;
+          if (node.name === 'navigator') return _safeNavigator;
+          return globalThis[node.name];
+        }
         return undefined;
 
       case 'Forbidden':
@@ -873,7 +1045,12 @@ function _evalNode(node, scope) {
         for (let i = 0; i < node.properties.length; i++) {
           const prop = node.properties[i];
           if (prop.spread) {
-            Object.assign(obj, _evalNode(prop.value, scope));
+            const src = _evalNode(prop.value, scope);
+            if (src && typeof src === 'object') {
+              for (const k of Object.keys(src)) {
+                if (!_FORBIDDEN_PROPS[k]) obj[k] = src[k];
+              }
+            }
           } else {
             const key = prop.computed ? _evalNode(prop.key, scope) : prop.key;
             if (_FORBIDDEN_PROPS[key]) continue;
@@ -1006,8 +1183,7 @@ function _execStmtNode(node, scope) {
       // so error-boundary directives can catch the error
       if (node.type === "CallExpr" && node.callee.type === "Identifier") {
         const name = node.callee.name;
-        if (!(name in scope) && !(name in _SAFE_GLOBALS) &&
-            (typeof globalThis === "undefined" || !(name in globalThis))) {
+        if (!(name in scope) && !(name in _SAFE_GLOBALS) && !_BROWSER_GLOBALS.has(name)) {
           throw new ReferenceError(name + " is not defined");
         }
       }
@@ -1124,25 +1300,17 @@ export function evaluate(expr, ctx) {
     const mainExpr = pipes[0];
     const { keys, vals } = _collectKeys(ctx);
 
-    // Add special variables
-    const specialKeys = [
-      "$store",
-      "$route",
-      "$router",
-      "$i18n",
-      "$refs",
-      "$form",
-    ];
-    for (const sk of specialKeys) {
-      if (!keys.includes(sk)) {
-        keys.push(sk);
-        vals[sk] = ctx[sk];
-      }
-    }
-
-    // Build scope object from keys/vals
+    // Build scope from cache without mutating it
     const scope = {};
     for (let i = 0; i < keys.length; i++) scope[keys[i]] = vals[keys[i]];
+    // Add special variables to scope only (never to the shared cache),
+    // preserving any same-named local context vars already in scope
+    if (!("$store"  in scope)) scope.$store  = _stores;
+    if (!("$route"  in scope)) scope.$route  = _routerInstance?.current;
+    if (!("$router" in scope)) scope.$router = _routerInstance;
+    if (!("$i18n"   in scope)) scope.$i18n   = _i18n;
+    if (!("$refs"   in scope)) scope.$refs   = ctx.$refs;
+    if (!("$form"   in scope)) scope.$form   = ctx.$form || null;
 
     // Parse expression into AST (cached)
     let ast = _exprCache.get(mainExpr);
@@ -1170,25 +1338,16 @@ export function evaluate(expr, ctx) {
 export function _execStatement(expr, ctx, extraVars = {}) {
   try {
     const { keys, vals } = _collectKeys(ctx);
-    // Add special vars
-    const specials = {
-      $store: _stores,
-      $route: _routerInstance?.current,
-      $router: _routerInstance,
-      $i18n: _i18n,
-      $refs: ctx.$refs,
-    };
-    Object.assign(specials, extraVars);
-    for (const [k, v] of Object.entries(specials)) {
-      if (!keys.includes(k)) {
-        keys.push(k);
-        vals[k] = v;
-      }
-    }
 
-    // Build scope
+    // Build scope from cache without mutating it, then add special vars and extraVars
     const scope = {};
     for (let i = 0; i < keys.length; i++) scope[keys[i]] = vals[keys[i]];
+    if (!("$store"  in scope)) scope.$store  = _stores;
+    if (!("$route"  in scope)) scope.$route  = _routerInstance?.current;
+    if (!("$router" in scope)) scope.$router = _routerInstance;
+    if (!("$i18n"   in scope)) scope.$i18n   = _i18n;
+    if (!("$refs"   in scope)) scope.$refs   = ctx.$refs;
+    Object.assign(scope, extraVars);
 
     // Snapshot context chain values for write-back comparison
     const chainKeys = new Set();
@@ -1227,10 +1386,11 @@ export function _execStatement(expr, ctx, extraVars = {}) {
       }
     }
 
-    // Write back new variables created during execution
+    // Write back new variables created during execution.
+    // Skip extraVars keys (e.g. __val, $el, $event) — they are execution-local
+    // and must not be persisted to the reactive context.
     for (const k in scope) {
-      if (k.startsWith("$") || chainKeys.has(k)) continue;
-      if (k in vals) continue;
+      if (k.startsWith("$") || chainKeys.has(k) || k in extraVars) continue;
       ctx.$set(k, scope[k]);
     }
 
@@ -1254,9 +1414,13 @@ export function resolve(path, ctx) {
 }
 
 // Interpolate strings like "/users/{user.id}?q={search}"
+// Note: interpolated values are encoded with encodeURIComponent, which encodes
+// "/" as "%2F". Path segments that intentionally contain "/" must be passed
+// as pre-encoded strings or concatenated outside of {} placeholders.
 export function _interpolate(str, ctx) {
   return str.replace(/\{([^}]+)\}/g, (_, expr) => {
     const val = evaluate(expr.trim(), ctx);
-    return val != null ? val : "";
+    if (val == null) return "";
+    return encodeURIComponent(String(val));
   });
 }

package/src/fetch.js

@@ -4,6 +4,8 @@
 
 import { _config, _interceptors, _cache } from "./globals.js";
 
+const _MAX_CACHE = 200;
+
 export function resolveUrl(url, el) {
   if (
     url.startsWith("http://") ||
@@ -31,6 +33,8 @@ export async function _doFetch(
   extraHeaders = {},
   el = null,
   externalSignal = null,
+  retries = undefined,
+  retryDelay = undefined,
 ) {
   const fullUrl = resolveUrl(url, el);
   let opts = {
@@ -68,7 +72,7 @@ export async function _doFetch(
   }
 
   // Retry logic
-  const maxRetries = _config.retries || 0;
+  const maxRetries = retries !== undefined ? retries : (_config.retries || 0);
   let lastError;
   for (let attempt = 0; attempt <= maxRetries; attempt++) {
     try {
@@ -115,7 +119,7 @@ export async function _doFetch(
       if (e.name === "AbortError") throw e; // Don't retry aborted requests
       lastError = e;
       if (attempt < maxRetries) {
-        await new Promise((r) => setTimeout(r, _config.retryDelay || 1000));
+        await new Promise((r) => setTimeout(r, retryDelay !== undefined ? retryDelay : (_config.retryDelay || 1000)));
       }
     }
   }
@@ -126,8 +130,12 @@ export function _cacheGet(key, strategy) {
   if (strategy === "none") return null;
   if (strategy === "memory") {
     const entry = _cache.get(key);
-    if (entry && Date.now() - entry.time < (_config.cache.ttl || 300000))
+    if (entry && Date.now() - entry.time < (_config.cache.ttl || 300000)) {
+      // Move to end (most-recently-used) for LRU eviction
+      _cache.delete(key);
+      _cache.set(key, entry);
       return entry.data;
+    }
     return null;
   }
   const store =
@@ -154,6 +162,11 @@ export function _cacheSet(key, data, strategy) {
   if (strategy === "none") return;
   const entry = { data, time: Date.now() };
   if (strategy === "memory") {
+    if (_cache.has(key)) {
+      _cache.delete(key); // refresh position before re-inserting
+    } else if (_cache.size >= _MAX_CACHE) {
+      _cache.delete(_cache.keys().next().value); // evict LRU (insertion-order first)
+    }
     _cache.set(key, entry);
     return;
   }

package/src/filters.js

@@ -20,7 +20,12 @@ _filters.slugify = (v) =>
     .toLowerCase()
     .replace(/[^a-z0-9]+/g, "-")
     .replace(/^-|-$/g, "");
-_filters.nl2br = (v) => String(v ?? "").replace(/\n/g, "<br>");
+_filters.nl2br = (v) =>
+  String(v ?? "")
+    .replace(/&/g, "&amp;")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/\n/g, "<br>");
 _filters.encodeUri = (v) => encodeURIComponent(String(v ?? ""));
 
 // Numbers

package/src/globals.js

@@ -17,6 +17,10 @@ export const _config = {
   debug: false,
   devtools: false,
   sanitize: true,
+  dangerouslyDisableSanitize: false,
+  sanitizeHtml: null,
+  exprCacheSize: 500,
+  maxEventListeners: 100,
 };
 
 export const _interceptors = { request: [], response: [] };
@@ -68,6 +72,22 @@ export function _watchExpr(expr, ctx, fn) {
   });
   if (typeof expr === "string" && expr.includes("$store")) {
     _storeWatchers.add(fn);
+    fn._el = _currentEl;
+    // Self-cleanup when the element is removed without going through dispose
+    const el = _currentEl;
+    if (el && el.parentElement) {
+      const ro = new MutationObserver(() => {
+        if (!el.isConnected) {
+          _storeWatchers.delete(fn);
+          unwatch();
+          ro.disconnect();
+        }
+      });
+      // subtree: false — we only care about direct children of parentElement being removed
+      ro.observe(el.parentElement, { childList: true, subtree: false });
+      // Also disconnect via the normal disposal path to avoid a dangling MO
+      _onDispose(() => ro.disconnect());
+    }
   }
 }
 

package/src/index.js

@@ -15,6 +15,7 @@ import {
   _routerInstance,
   setRouterInstance,
   _log,
+  _warn,
   _notifyStoreWatchers,
 } from "./globals.js";
 import { _i18n, _loadI18nForLocale } from "./i18n.js";
@@ -87,7 +88,14 @@ const NoJS = {
       _warn("csp config option removed — No.JS is now CSP-safe by default");
       delete opts.csp;
     }
+    if (opts.exprCacheSize !== undefined) {
+      const n = parseInt(opts.exprCacheSize);
+      opts.exprCacheSize = (Number.isFinite(n) && n > 0) ? n : 500;
+    }
     Object.assign(_config, opts);
+    if (opts.sanitize === false) {
+      _warn('sanitize:false is deprecated — use dangerouslyDisableSanitize:true to make the risk explicit.');
+    }
     if (opts.headers)
       _config.headers = { ...prevHeaders, ...opts.headers };
     if (opts.csrf) _config.csrf = opts.csrf;
@@ -210,6 +218,12 @@ const NoJS = {
   // Event bus
   on(event, fn) {
     if (!_eventBus[event]) _eventBus[event] = [];
+    if (_eventBus[event].length >= _config.maxEventListeners) {
+      _warn(
+        'MaxListenersExceeded: event "' + event + '" has ' + _eventBus[event].length +
+        ' listeners (max ' + _config.maxEventListeners + '). Possible memory leak.'
+      );
+    }
     _eventBus[event].push(fn);
     return () => {
       _eventBus[event] = _eventBus[event].filter((f) => f !== fn);
@@ -244,7 +258,7 @@ const NoJS = {
   resolve,
 
   // Version
-  version: "1.9.1",
+  version: "1.10.1",
 };
 
 export default NoJS;