mirror of
https://github.com/Matysh/houseplan-card
synced 2026-10-07 23:19:14 +00:00
Codex
6b64801603
The shadow of a device marker is sized from the marker, and the marker is sized from the container: --device-shell-shadow is expressed in --dev-size, which resolves to 2.5cqw. With box-shadow in the transition list, every container-query re-evaluation — a tooltip, a scrollbar, a rotation — produced a new computed value and restarted a 150 ms non-composited transition on every marker at once. The owner's Firefox profile shows what that costs: 244 box-shadow transitions, all on span.device-shell-frame, all oncompositor:false, in bursts of exactly 61 (the markers on screen), four bursts in two seconds. During them the tab presented 103 frames in 11 seconds — 9.4 per second, CONTENT_FRAME_TIME median 149 ms and up to 320 — while the refresh driver waited for paint 381 times. Our JavaScript in the worst three seconds: 16 ms. Chromium starts the same transitions (measured: one pixel of container width starts two per marker in both engines) and merely pays less for them, which is why this hid there. The shadow itself is unchanged; it simply applies at once. The core keeps the same treatment, so the selection and focus rings appear without a fade — an instant ring is ordinary feedback, a faded one costs a full-frame repaint per marker. Hover still animates border-color. Issue: #524 User-Visible: yes
2 lines
1.2 KiB
JavaScript
2 lines
1.2 KiB
JavaScript
globalThis.__HOUSEPLAN_BUILD_FINGERPRINT__="ff98640cc5310e1e90e00b0cf23e42c8b1ac0953c6ad38786af6378331273765";try{await import("./houseplan-assets/houseplan-card-D0jk3o_K.js")}catch(e){if(!customElements.get("houseplan-card")){const l=String(navigator.language||"en").toLowerCase();const m=l.startsWith("ru")?"House Plan обновился — перезагрузите страницу (Ctrl+F5).":l.startsWith("de")?"House Plan wurde aktualisiert — bitte laden Sie die Seite neu (Strg+F5).":l.startsWith("fr")?"House Plan a été mis à jour — veuillez recharger la page (Ctrl+F5).":"House Plan was updated — please reload the page (Ctrl+F5).";customElements.define("houseplan-card",class extends HTMLElement{setConfig(){}getCardSize(){return 1}connectedCallback(){this.style.cssText="display:block;box-sizing:border-box;padding:16px;border:1px solid var(--divider-color,#e0e0e0);border-radius:var(--ha-card-border-radius,12px);background:var(--card-background-color,#fff);color:var(--primary-text-color,#212121);font:14px/1.4 var(--paper-font-body1_-_font-family,sans-serif)";this.textContent=m}})}console.error("[houseplan] stale houseplan-card.js: the implementation chunk is unavailable",e)}
|