skills.rest
RavitejaKarra24
RavitejaKarra24COMMUNITY
Explore all skills by this author →
𝕏@RavitejaKarra24GitHub

best-practices

Applies modern web security, compatibility, and code quality standards to frontend codebases.

Updated Mar 12, 2026
Search Tags:#code quality#frontend#security audit#lighthouse#csp#web security#xss prevention
One-click install
npx skills add https://github.com/RavitejaKarra24/dotfiles --skill best-practices-ravitejakarra24
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: best-practices
Source: https://github.com/RavitejaKarra24/dotfiles/tree/main/agents/.agents/skills/best-practices
Command: npx skills add https://github.com/RavitejaKarra24/dotfiles --skill best-practices-ravitejakarra24

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Web applications often ship with security vulnerabilities, deprecated APIs, and compatibility issues that fail Lighthouse best practices audits. This Skill provides a concrete checklist and code patterns to audit and fix these problems systematically. ## Core Features & Use Cases - Security Hardening: Enforce HTTPS, CSP with nonces, Trusted Types, Subresource Integrity, HSTS, and secure cookie attributes while avoiding vulnerable dependency patterns like prototype pollution. - Browser Compatibility: Apply HTML5 doctype, charset, viewport, feature detection, and safe polyfill strategies while removing deprecated APIs like document.write and synchronous XHR. - Code Quality & Performance: Use semantic HTML, passive event listeners, error boundaries, memory cleanup with AbortController, and hidden source maps. - Use Case: Run a security audit on a production frontend and get concrete fixes for missing CSP headers, unpinned CDN scripts, and exposed source maps. ## Quick Start Ask the AI to audit your web project for security vulnerabilities and modern best practices violations.

Frequently Asked Questions about best-practices

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I secure a web app against XSS attacks?▼

Use a strict Content Security Policy with nonces, enforce Trusted Types so DOM sinks reject raw strings, and sanitize any HTML input with DOMPurify. Avoid innerHTML with user input and prefer textContent for plain text.

What security headers should a website have?▼

Set Strict-Transport-Security, Content-Security-Policy with frame-ancestors, X-Content-Type-Options: nosniff, Referrer-Policy, and Permissions-Policy. Do not send X-XSS-Protection, which is deprecated and was removed from modern browsers.

How do I protect against compromised CDN scripts?▼

Pin every third-party script and stylesheet with Subresource Integrity hashes and the crossorigin attribute. Self-host polyfills or use a vetted mirror, since the polyfill.io service was compromised in a 2024 supply-chain attack.

Does this work with React and Angular applications?▼

Yes. Angular has built-in Trusted Types support, React 19+ produces TrustedHTML when Trusted Types are enforced, and the Skill includes a React ErrorBoundary pattern for catching rendering errors.

Why should source maps be hidden in production?▼

Public source maps expose your unminified source code to anyone. Use hidden-source-map in webpack or sourcemap: 'hidden' in Vite, and strip sourcesContent before uploading maps to error trackers like Sentry.

Related Skills

Explore More Software Engineering Skills→
dapperdiversdapperdivers
1

header-analysis

Audit HTTP response headers and cookie attributes for missing security controls.

Community
Intermediate
Martino17xMartino17x

best-practices

Applies web security, compatibility, and code quality standards based on Lighthouse audits.

Community
Intermediate
REVREBELREVREBEL

seo-page

Audit a single web page's on-page SEO, schema markup, and core web vitals.

Official
Advanced
ThePhoenixAgencyThePhoenixAgency

ci-cd-pipelines

Automate CI/CD pipelines with GitHub Actions and GitLab CI.

Official
Intermediate