noQwikUseVisibleTask
Summary
Section titled “Summary”- Rule available since:
v2.1.4 - Diagnostic Category:
lint/nursery/noQwikUseVisibleTask - This rule doesn’t have a fix.
- The default severity of this rule is warning.
- This rule belongs to the following domains:
- Sources:
- Same as
qwik/no-use-visible-task
- Same as
Description
Section titled “Description”Disallow useVisibleTask$() functions in Qwik components.
Prevents hydration-blocking operations that hurt Qwik’s resumability. See Qwik Tasks Documentation for proper alternatives.
Examples
Section titled “Examples”Invalid
Section titled “Invalid”useVisibleTask$(() => { console.log('Component is visible');});code-block.js:1:1 lint/nursery/noQwikUseVisibleTask ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⚠ Avoid useVisibleTask$ for non-interactive initialization
> 1 │ useVisibleTask$(() => {
│ ^^^^^^^^^^^^^^^
2 │ console.log(‘Component is visible’);
3 │ });
ℹ This hook executes immediately on component mount without user interaction, potentially:
- Hurting performance (blocking hydration)
- Causing layout shifts (CLS)
- Breaking SSR compatibility
ℹ Check the Qwik documentation for suitable alternatives.
useTask$(() => { console.log('Task executed');});How to configure
Section titled “How to configure”{ "linter": { "rules": { "nursery": { "noQwikUseVisibleTask": "error" } } }}