JavaScript Security Checklist for 2026: Protect Your Web Apps
A practical security checklist covering XSS prevention, CSP, dependency auditing, and secure coding patterns for JavaScript apps.
Why a Security Checklist?
Security is not a feature you add at the end — it's a practice baked into every line of code. This checklist covers the most critical security measures for JavaScript web applications in 2026, from XSS prevention to supply chain security.
XSS Prevention
Cross-Site Scripting remains the most common web vulnerability. Never trust user input.
``javascript
// DANGEROUS: directly inserting user input
element.innerHTML = userInput; // XSS vulnerability!
// SAFE: use textContent for plain text element.textContent = userInput;
// SAFE: use a sanitizer for rich content import DOMPurify from 'dompurify'; element.innerHTML = DOMPurify.sanitize(userInput);
// SAFE: use the Sanitizer API (native, modern browsers) const sanitizer = new Sanitizer(); element.setHTML(userInput, { sanitizer });
// Template literals in HTML — still dangerous const html = \
; // XSS if userInput contains // Report violations to catch issues
// Content-Security-Policy-Report-Only: ...;
// report-uri /csp-report;
// Server-side CSP report handler
app.post('/csp-report', (req, res) => {
const violation = req.body['csp-report'];
console.warn('CSP Violation:', {
blockedURI: violation['blocked-uri'],
violatedDirective: violation['violated-directive'],
documentURI: violation['document-uri']
});
res.status(204).end();
});
`Dependency Security
Supply chain attacks are on the rise. Audit and lock your dependencies.
bash
# Regular audits
npm audit
npm audit fix# Lock dependencies to exact versions
npm config set save-exact true
# Use lockfile-lint to verify integrity
npx lockfile-lint --path package-lock.json --type npm \
--allowed-hosts npm --validate-https
`javascript
// Subresource Integrity for CDN scripts
// // Verify SRI hash programmatically
async function verifySRI(url, expectedHash) {
const response = await fetch(url);
const text = await response.text();
const encoder = new TextEncoder();
const data = encoder.encode(text);
const hashBuffer = await crypto.subtle.digest('SHA-384', data);
const hashArray = Array.from(new Uint8Array(hashBuffer));
const hash = btoa(String.fromCharCode(...hashArray));
return \
sha384-\${hash}\ === expectedHash;
}
`Secure Data Handling
javascript
// Never store sensitive data in localStorage (XSS-accessible)
// Use httpOnly, secure cookies instead// Sanitize before database queries (prevent injection)
// Use parameterized queries, never string concatenation
// Encrypt sensitive data at rest
async function encryptData(data, key) {
const iv = crypto.getRandomValues(new Uint8Array(12));
const encoded = new TextEncoder().encode(JSON.stringify(data));
const encrypted = await crypto.subtle.encrypt(
{ name: 'AES-GCM', iv },
key,
encoded
);
return { iv, encrypted };
}
``Security is everyone's responsibility. Run this checklist regularly, automate what you can (CSP headers, dependency audits, linting rules), and stay updated on new vulnerabilities through resources like OWASP and Snyk advisories.