skills.rest
NewEarthAI
NewEarthAICOMMUNITY
Explore all skills by this author →
GitHub

site-speed-boost

Diagnose and optimize React, Supabase, and Vercel app performance.

Updated Aug 27, 2026
Search Tags:#Vercel#React#performance optimization#Supabase#site speed
One-click install
npx skills add https://github.com/NewEarthAI/vibecode-project-template --skill site-speed-boost
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: site-speed-boost
Source: https://github.com/NewEarthAI/vibecode-project-template/tree/main/.claude/skills/site-speed-boost
Command: npx skills add https://github.com/NewEarthAI/vibecode-project-template --skill site-speed-boost

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright, supabase, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides systematic performance diagnosis and optimization for React + Supabase + Vercel apps, addressing slow loading times and page performance issues.

Core Features & Use Cases

  • Performance Diagnosis: Runs a 6-phase diagnostic, including browser measurement, network waterfall, database EXPLAIN, and targeted fixes.
  • Use Case: Ideal for resolving user complaints of slow pages, long loading times, and white flashes during navigation or filter changes.
  • NOT for: CSS animations, bundle size, Lighthouse scores, or SEO performance.

Quick Start

Use the site-speed-boost skill to analyze the performance of your React + Supabase + Vercel app and identify bottlenecks for optimization.

Frequently Asked Questions about site-speed-boost

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

FAQPage Schema
How do I diagnose slow page loading in my React and Supabase application?▼

Diagnose slow page loading in your React and Supabase application by running a 6-phase diagnostic covering browser measurement, network waterfall analysis, and database EXPLAIN to identify bottlenecks.

What's the best way to fix long loading times and white flashes during navigation in my Vercel app?▼

Resolve long loading times and white flashes during navigation in your Vercel app through systematic performance optimization, targeting React Query tuning and database indexing recommendations after diagnosis.

Can I use this site speed optimization framework to improve my Lighthouse scores and bundle size?▼

No, this site speed optimization framework does not address Lighthouse scores, bundle size, CSS animations, or SEO performance, as it specifically targets runtime loading and database bottlenecks.

What do I need to access before optimizing my React and Supabase site performance?▼

Before optimizing your React and Supabase site performance, you need access to your app's codebase and Supabase project to enable full functionality, including Playwright browser measurement and network waterfall diagnostics.

Why does my Supabase database query cause slow page performance in my React app?▼

Your Supabase database query causes slow page performance in your React app due to missing indexes or inefficient queries, identified through database EXPLAIN diagnostics and resolved with targeted indexing recommendations.

Related Skills

Explore More Software Engineering Skills→
JaylaelikeJaylaelike

supabase-nextjs

Configure Next.js App Router projects with Supabase authentication and Drizzle ORM.

Community
Intermediate
Mentor-WizardMentor-Wizard
10

postgresql-optimization

Analyze PostgreSQL queries with EXPLAIN ANALYZE and tune indexes and configuration.

Official
Advanced
SamuelSahaSamuelSaha

CI/CD Pipeline Mastery

Automate CI/CD for web apps with GitHub Actions and Vercel.

Community
Advanced
OussemasahbeniOussemasahbeni
51

optimize

Diagnose and fix web application performance issues across loading, rendering, and animations.

Community
Advanced