What tech stack is this skill designed for?

This skill is optimized for applications using Apollo Client/Server, Redis, CloudFront, S3, and React with Prisma.

Does it help with Google's Core Web Vitals?

Yes, it provides specific implementation patterns and targets for LCP (Largest Contentful Paint), INP (Interaction to Next Paint), and CLS (Cumulative Layout Shift).

Can this skill help reduce my JS bundle size?

Absolutely. It includes patterns for route-based splitting, dynamic imports for heavy libraries, and guidelines for managing vendor chunks.

How does it handle database performance?

It provides Prisma-specific optimizations, such as field selection and include-clause management, paired with Redis cache-aside patterns to reduce DB load.

Web Performance Optimization

Name: Web Performance Optimization
Author: AlexanderStephenThompson

byAlexanderStephenThompson

0•

API Development

Optimizes full-stack application speed using Apollo caching, Redis strategies, and CloudFront infrastructure patterns.

The Web Performance skill provides a comprehensive framework for accelerating modern web applications across every layer of the stack. It offers production-ready patterns for Apollo Client/Server caching, Redis cache-aside implementations, and CloudFront/S3 asset delivery. By integrating Core Web Vitals targets, bundle size management, and React-specific optimizations like virtualization and memoization, this skill helps developers build highly responsive interfaces while reducing server load and infrastructure costs.

Key Features

01CloudFront and S3 optimization for static assets and image resizing

02React performance patterns including memoization and list virtualization

03Apollo Client cache configuration with custom type policies and fetch strategies

04Bundle size auditing and advanced code-splitting techniques

05Redis integration for server-side caching and TTL management guidelines

060 GitHub stars

Use Cases

01Reducing infrastructure costs by offloading database queries to Redis and CDNs

02Scaling GraphQL APIs with multi-layer caching and optimistic UI updates

03Improving Core Web Vitals scores like Largest Contentful Paint and Interaction to Next Paint

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add alexanderstephenthompson/claude-hub web-performance

For use in Claude.ai and ChatGPT

Download Skill