Rules Hub
Code Ruleset
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
Don't set both async and defer on a script element
Choose script scheduling deliberately; async precedence, modules and dynamic insertion have distinct behavior.
Bad example
| 1 | script.async = true; |
| 2 | script.defer = true; |
Explanation (EN)
Setting both without an intentional compatibility reason obscures the effective async scheduling.
Objašnjenje (HR)
Good example
| 1 | const script = document.createElement("script"); |
| 2 | script.src = independentWidgetUrl; |
| 3 | script.async = true; |
| 4 | document.head.append(script); |
Explanation (EN)
This independent dynamically inserted classic script may execute as soon as it loads; it does not rely on document parse order.
Objašnjenje (HR)
Notes (EN)
Choose loading behavior for the actual script kind and insertion path, then set only attributes needed for that contract.
Exceptions / Tradeoffs (EN)
For classic scripts with both attributes, async takes precedence; defer can be intentional legacy fallback. Module and dynamically inserted scripts have different scheduling, so defer is not a universal DOM-ready switch.