perf: replace empty functions with noopQrl by wmertens · Pull Request #6871 · QwikDev/qwik

wmertens · 2024-09-08T10:19:59Z

This is a fairly trivial improvement, but it does avoid loading empty functions on the client.

To make it work, I needed to run the simplification twice (before and after segmentation) but it's still fast.

TODO:

don't remove code in server before scope captures are recorded
make the qrl serialization skip client noopQrl, perhaps by emitting "noop" segment info from the client transform

changeset-bot · 2024-09-08T10:20:02Z

⚠️ No Changeset found

Latest commit: 9e87449

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

wmertens · 2024-09-08T13:01:56Z

hmm the e2e aren't happy :(

packages/qwik-router/src/buildtime/runtime-generation/generate-entries.ts

+  c.push(`\n/** Qwik Router Entries (${entries.length}) */`);
+  for (let i = 0; i < entries.length; i++) {
+    const entry = entries[i];
+    c.push(`export const ${entry.id} = () => import(${JSON.stringify(entry.filePath)});`);


To fix the problem, we need to ensure that any potentially dangerous characters in entry.filePath are properly escaped before being included in the generated JavaScript code. We can achieve this by implementing a function that escapes these characters and using it to sanitize entry.filePath.

Implement a function escapeUnsafeChars that escapes potentially dangerous characters.

Use this function to sanitize entry.filePath before including it in the generated code.

packages/qwik/src/core/client/dom-container.ts

+        }
+        errorDiv.setAttribute('q:key', '_error_');
+        const journal: VNodeJournal = [];
+        vnode_getDOMChildNodes(journal, vHost).forEach((child) => errorDiv.appendChild(child));


packages/qwik/src/core/client/vnode-diff.ts

+        }
+
+        if (key === dangerouslySetInnerHTML) {
+          element.innerHTML = value as string;


To fix this issue, we need to ensure that the value assigned to element.innerHTML is properly sanitized to prevent XSS attacks. The best way to do this is to use a function that escapes HTML special characters before assigning the value to innerHTML.

Import or define an HTML escaping function if not already available.

Use this function to sanitize value before assigning it to element.innerHTML.

packages/qwik/src/core/client/vnode.ts

+        } else if (key === 'value' && key in element) {
+          (element as any).value = escapeHTML(String(value));
+        } else if (key === dangerouslySetInnerHTML) {
+          (element as any).innerHTML = value!;


To fix the problem, we need to ensure that any value assigned to innerHTML is properly sanitized to prevent XSS attacks. This can be achieved by using a library like DOMPurify to sanitize the HTML content before assigning it to innerHTML.

Import the DOMPurify library.

Use DOMPurify.sanitize to sanitize the value before assigning it to innerHTML.

packages/qwik/src/core/client/vnode.ts

+        const insertBefore = journal[idx++] as Element | Text | null;
+        let newChild: any;
+        while (idx < length && typeof (newChild = journal[idx]) !== 'number') {
+          insertParent.insertBefore(newChild, insertBefore);


To fix the problem, we need to ensure that any text content being inserted into the DOM is properly escaped to prevent XSS attacks. This can be achieved by using a function that escapes HTML special characters before inserting the content.

We will use the escapeHTML function to escape any text content before it is inserted into the DOM.

Specifically, we will modify the vnode_applyJournal function to escape newChild before it is inserted using insertBefore.

shairez · 2025-05-06T18:47:55Z

@wmertens any news on this PR?

note: reg_ctx_name_segments output is wrong, should include the server qrl

wmertens · 2026-03-05T06:45:00Z

closing in favor of #8407

wmertens added COMP: performance Optimizer labels Sep 8, 2024

wmertens self-assigned this Sep 8, 2024

wmertens requested a review from a team as a code owner September 8, 2024 10:20

wmertens force-pushed the optimizer-noop branch from 31dc690 to 1f6ed4b Compare September 8, 2024 11:48

wmertens force-pushed the optimizer-noop branch from 1f6ed4b to f80f6be Compare October 17, 2024 21:24

wmertens mentioned this pull request Nov 20, 2024

[🐞] Defining and calling $server() function inside onClick$ causes Error: Dynamic require of "_.js" is not supported #5495

Open

wmertens marked this pull request as draft November 28, 2024 11:58

wmertens force-pushed the optimizer-noop branch from f80f6be to f6c783a Compare December 13, 2024 12:46

wmertens force-pushed the optimizer-noop branch from f6c783a to febced5 Compare February 6, 2025 16:26

github-advanced-security bot found potential problems Feb 6, 2025

View reviewed changes

shairez mentioned this pull request Mar 25, 2025

fix: deprecated event$ #7407

Closed

5 tasks

wmertens changed the base branch from main to build/v2 August 18, 2025 16:02

maiieul mentioned this pull request Aug 21, 2025

fix: deprecated event$ #7843

Closed

5 tasks

wmertens mentioned this pull request Aug 29, 2025

[🐞] Optimizer should find all qrls inside qrls even when only building for client or server #3189

Open

wmertens mentioned this pull request Sep 8, 2025

[📖] event$ #4452

Open

wmertens added 2 commits September 17, 2025 10:07

fix(rust): prep tests for better noop

9e5f68d

note: reg_ctx_name_segments output is wrong, should include the server qrl

wip

9e87449

wmertens force-pushed the optimizer-noop branch from 538f41a to 9e87449 Compare September 18, 2025 09:15

maiieul removed the performance label Feb 8, 2026

wmertens closed this Mar 5, 2026

Varixo deleted the optimizer-noop branch March 6, 2026 19:16

@@ -2,2 +2,20 @@
+            function escapeUnsafeChars(str: string): string {
+              const charMap: { [key: string]: string } = {
+                '<': '\\u003C',
+                '>': '\\u003E',
+                '/': '\\u002F',
+                '\\': '\\\\',
+                '\b': '\\b',
+               '\f': '\\f',
+               '\n': '\\n',
+               '\r': '\\r',
+               '\t': '\\t',
+               '\0': '\\0',
+               '\u2028': '\\u2028',
+               '\u2029': '\\u2029'
+             };
+             return str.replace(/[<>\b\f\n\r\t\0\u2028\u2029]/g, x => charMap[x]);
+            }
             export function createEntries(ctx: BuildContext, c: string[]) {
@@ -25,3 +43,3 @@
                 const entry = entries[i];
-                c.push(`export const ${entry.id} = () => import(${JSON.stringify(entry.filePath)});`);
+                c.push(`export const ${entry.id} = () => import(${escapeUnsafeChars(JSON.stringify(entry.filePath))});`);
               }

@@ -669,3 +669,3 @@
                     if (key === dangerouslySetInnerHTML) {
-                      element.innerHTML = value as string;
+                      element.innerHTML = escapeHTML(value as string);
                       element.setAttribute(QContainerAttr, QContainerValue.HTML);

@@ -120,2 +120,3 @@
             import { isDev } from '@qwik.dev/core/build';
+            import DOMPurify from 'dompurify';
             import { qwikDebugToString } from '../debug';
@@ -895,3 +896,3 @@
                     } else if (key === dangerouslySetInnerHTML) {
-                      (element as any).innerHTML = value!;
+                      (element as any).innerHTML = DOMPurify.sanitize(value!);
                     } else {

@@ -10,3 +10,4 @@
               "dependencies": {
-                "csstype": "^3.1"
+                "csstype": "^3.1",
+                "dompurify": "^3.2.4"
               },

Package	Version	Security advisories
dompurify (npm)	3.2.4	None

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

perf: replace empty functions with noopQrl#6871

perf: replace empty functions with noopQrl#6871
wmertens wants to merge 2 commits intobuild/v2from
optimizer-noop

wmertens commented Sep 8, 2024 •

edited

Loading

Uh oh!

changeset-bot bot commented Sep 8, 2024 •

edited

Loading

Uh oh!

wmertens commented Sep 8, 2024

Uh oh!

Check warning

Copilot Autofix

Check warning

Copilot Autofix

Check warning

Copilot Autofix

Check warning

Copilot Autofix

Check warning

Copilot Autofix

shairez commented May 6, 2025

Uh oh!

wmertens commented Mar 5, 2026 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

@@ -925,2 +925,5 @@
                     while (idx < length && typeof (newChild = journal[idx]) !== 'number') {
+                      if (newChild.nodeType === Node.TEXT_NODE) {
+                        newChild.nodeValue = escapeHTML(newChild.nodeValue);
+                      }
                       insertParent.insertBefore(newChild, insertBefore);

Conversation

wmertens commented Sep 8, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

changeset-bot bot commented Sep 8, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

wmertens commented Sep 8, 2024

Uh oh!

Check warning

Copilot Autofix

Check warning

Copilot Autofix

Check warning

Copilot Autofix

Check warning

Copilot Autofix

Check warning

Copilot Autofix

shairez commented May 6, 2025

Uh oh!

wmertens commented Mar 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

wmertens commented Sep 8, 2024 •

edited

Loading

changeset-bot bot commented Sep 8, 2024 •

edited

Loading

wmertens commented Mar 5, 2026 •

edited

Loading