diff options
author | Hayleigh Thompson <me@hayleigh.dev> | 2024-01-26 23:33:11 +0000 |
---|---|---|
committer | Hayleigh Thompson <me@hayleigh.dev> | 2024-01-26 23:33:11 +0000 |
commit | 235fcd2ae0229272ebb0927806d301c8b887c1ba (patch) | |
tree | 279fc8348bea9850a2719569a63cef6d438feeda | |
parent | 2d5b7c095e26f46137b920315a7468eab2f1944c (diff) | |
download | lustre-235fcd2ae0229272ebb0927806d301c8b887c1ba.tar.gz lustre-235fcd2ae0229272ebb0927806d301c8b887c1ba.zip |
:recycle: Temporarily disable a performance optimisation that caused bugs with input elements.
-rw-r--r-- | src/client-runtime.ffi.mjs | 18 | ||||
-rw-r--r-- | src/vdom.ffi.mjs | 24 |
2 files changed, 20 insertions, 22 deletions
diff --git a/src/client-runtime.ffi.mjs b/src/client-runtime.ffi.mjs index 16895a7..bb3bf9d 100644 --- a/src/client-runtime.ffi.mjs +++ b/src/client-runtime.ffi.mjs @@ -61,21 +61,19 @@ export class LustreClientApplication { bubbles: true, detail: data, composed: true, - }) + }), ); } #tick() { this.#flush_queue(); - if (this.#didUpdate) { - const vdom = this.#view(this.#model); + const vdom = this.#view(this.#model); - this.#didUpdate = false; - this.#root = morph(this.#root, vdom, (msg) => { - this.send(new Dispatch(msg)); - }); - } + this.#didUpdate = false; + this.#root = morph(this.#root, vdom, (msg) => { + this.send(new Dispatch(msg)); + }); } #flush_queue(iterations = 0) { @@ -90,7 +88,7 @@ export class LustreClientApplication { while (this.#effects.length) { this.#effects.shift()( (msg) => this.send(new Dispatch(msg)), - (event, data) => this.emit(event, data) + (event, data) => this.emit(event, data), ); } @@ -121,7 +119,7 @@ export const start = (app, selector, flags) => selector, app.init, app.update, - app.view + app.view, ); // UTILS ----------------------------------------------------------------------- diff --git a/src/vdom.ffi.mjs b/src/vdom.ffi.mjs index ec5a226..3a6e5a1 100644 --- a/src/vdom.ffi.mjs +++ b/src/vdom.ffi.mjs @@ -43,7 +43,7 @@ export function morph(prev, curr, dispatch, parent) { "function should only be called internally by lustre's runtime: if you think", "this is an error, please open an issue at", "https://github.com/hayleigh-dot-dev/gleam-lustre/issues/new", - ].join(" ") + ].join(" "), ); } @@ -187,25 +187,21 @@ function morphElement(prev, curr, dispatch, parent) { ) { currAttrs.set( currAttr[0], - `${currAttrs.get("dangerous-unescaped-html")} ${currAttr[1]}` + `${currAttrs.get("dangerous-unescaped-html")} ${currAttr[1]}`, ); } else if (currAttr[0] !== "") { currAttrs.set(currAttr[0], currAttr[1]); } } - // TODO: Event listeners aren't currently removed when they are removed from - // the attributes list. This is a bug! - for (const { name, value: prevValue } of prevAttrs) { + for (const { name } of prevAttrs) { if (!currAttrs.has(name)) { prev.removeAttribute(name); } else { const value = currAttrs.get(name); - if (value !== prevValue) { - morphAttr(prev, name, value, dispatch); - currAttrs.delete(name); - } + morphAttr(prev, name, value, dispatch); + currAttrs.delete(name); } } @@ -317,9 +313,13 @@ function morphAttr(el, name, value, dispatch) { } case "string": - if (el.getAttribute(name) !== value) el.setAttribute(name, value); - if (value === "") el.removeAttribute(name); - if (name === "value" && el.value !== value) el.value = value; + if (name === "value") el.value = value; + if (value === "") { + el.removeAttribute(name); + } else { + el.setAttribute(name, value); + } + break; // Event listeners need to be handled slightly differently because we need |