·webperf-resources
{}

webperf-resources

✓
nucliweb/webperf-snippetsGitHub: nucliweb/webperf-snippetsSource: nucliweb/webperf-snippets

Intelligent network quality analysis with adaptive loading strategies. Detects connection type (2g/3g/4g), bandwidth, RTT, and save-data mode, then automatically triggers appropriate optimization workflows. Includes decision trees that recommend image compression for slow connections, critical CSS inlining for high RTT, and save-data optimizations (disable autoplay, reduce quality). Features connection-aware performance budgets (500KB for 2g, 1.5MB for 3g, 3MB for 4g+) and adaptive loading implementation guides. Cross-skill integration with Loading (TTFB impact), Media (responsive images), and Core Web Vitals (connection impact on LCP/INP). Use when the user asks about slow connections, mobile optimization, save-data support, or adaptive loading strategies. Compatible with Chrome DevTools MCP.

nucliweb·webperf·resources
11Installs·1Trend·@nucliweb

Installation

GitHub: nucliweb/webperf-snippets
$npx skills add https://github.com/nucliweb/webperf-snippets --skill webperf-resources

How to Install webperf-resources

Quickly install webperf-resources AI skill to your development environment via command line

  1. Open Terminal: Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.)
  2. Run Installation Command: Copy and run this command: npx skills add https://github.com/nucliweb/webperf-snippets --skill webperf-resources
  3. Verify Installation: Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw

Source: nucliweb/webperf-snippets.

SKILL.md

View raw

JavaScript snippets for measuring web performance in Chrome DevTools. Execute with mcpchrome-devtoolsevaluatescript, capture output with mcpchrome-devtoolsgetconsolemessage.

When the user asks about network performance, connection quality, or adaptive loading:

When implementing adaptive loading or the user asks "how to optimize for slow connections":

Intelligent network quality analysis with adaptive loading strategies. Detects connection type (2g/3g/4g), bandwidth, RTT, and save-data mode, then automatically triggers appropriate optimization workflows. Includes decision trees that recommend image compression for slow connections, critical CSS inlining for high RTT, and save-data optimizations (disable autoplay, reduce quality). Features connection-aware performance budgets (500KB for 2g, 1.5MB for 3g, 3MB for 4g+) and adaptive loading implementation guides. Cross-skill integration with Loading (TTFB impact), Media (responsive images), and Core Web Vitals (connection impact on LCP/INP). Use when the user asks about slow connections, mobile optimization, save-data support, or adaptive loading strategies. Compatible with Chrome DevTools MCP. Source: nucliweb/webperf-snippets.

Facts (cite-ready)

Stable fields and commands for AI/search citations.

Install command
npx skills add https://github.com/nucliweb/webperf-snippets --skill webperf-resources
Source
nucliweb/webperf-snippets
Category
{}Data Analysis
Verified
✓
First Seen
2026-03-10
Updated
2026-03-10
URL
https://www.learn-skills.dev/en/skills/nucliweb/webperf-snippets/webperf-resources

Browse more skills from nucliweb/webperf-snippets

Quick answers

What is webperf-resources?

Intelligent network quality analysis with adaptive loading strategies. Detects connection type (2g/3g/4g), bandwidth, RTT, and save-data mode, then automatically triggers appropriate optimization workflows. Includes decision trees that recommend image compression for slow connections, critical CSS inlining for high RTT, and save-data optimizations (disable autoplay, reduce quality). Features connection-aware performance budgets (500KB for 2g, 1.5MB for 3g, 3MB for 4g+) and adaptive loading implementation guides. Cross-skill integration with Loading (TTFB impact), Media (responsive images), and Core Web Vitals (connection impact on LCP/INP). Use when the user asks about slow connections, mobile optimization, save-data support, or adaptive loading strategies. Compatible with Chrome DevTools MCP. Source: nucliweb/webperf-snippets.

How do I install webperf-resources?

Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/nucliweb/webperf-snippets --skill webperf-resources Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw

Where is the source repository?

https://github.com/nucliweb/webperf-snippets

Details

Category
{}Data Analysis
Source
skills.sh
First Seen
2026-03-10

Related Skills

webperf
13 Installs
webperf-core-web-vitals
12 Installs
webperf-media
12 Installs
webperf-interaction
11 Installs
webperf-loading
11 Installs