web-quality-best-practices

Run npm audit to find vulnerable dependencies, then check for HTTPS enforcement, CSP headers, Trusted Types enforcement, and SRI hashes on third-party scripts. The Skill provides a complete security checklist covering HSTS, X-Content-Type-Options, and Referrer-Policy headers.

Configure a CSP header with default-src 'self', script-src with nonces, frame-ancestors, base-uri, and form-action directives. Use nonces for inline scripts and roll out with Content-Security-Policy-Report-Only before enforcing.

Trusted Types is a browser mechanism that makes DOM sinks like innerHTML reject raw strings and accept only sanitized typed objects from a named policy. Enforce it with the require-trusted-types-for 'script' CSP directive and use DOMPurify as the sanitizer.

No, never load polyfills from third-party CDNs you do not control; polyfill.io was compromised in a 2024 supply-chain attack. Bundle polyfills at build time with Babel or core-js, or self-host with Subresource Integrity hashes.

document.write blocks HTML parsing and breaks in async contexts, while synchronous XHR blocks the main thread and freezes the UI. Replace them with dynamically created script elements and async fetch calls.

Use hidden-source-map in webpack or sourcemap: 'hidden' in Vite so the sourceMappingURL comment is not emitted. Strip sourcesContent from maps uploaded to error trackers to avoid exposing original source code.