Automatically optimizes Cloudflare Workers performance during development, focusing on cold starts, bundle size, edge caching, and global latency
Automatically optimizes Cloudflare Workers performance during development by detecting heavy dependencies, sequential operations, and missing edge caching. Activates when adding large libraries like moment/lodash, finding sequential storage calls, or identifying bundle size increases that hurt cold starts.
/plugin marketplace add hirefrank/hirefrank-marketplace/plugin install edge-stack@hirefrank-marketplaceThis skill inherits all available tools. When active, it can use any tool Claude has access to.
This SKILL automatically activates when:
// These patterns trigger immediate alerts:
import axios from 'axios'; // Heavy dependency (13KB)
import moment from 'moment'; // Heavy dependency (68KB)
import _ from 'lodash'; // Heavy dependency (71KB)
// Sequential operations that could be parallel
const user = await env.USERS.get(id);
const settings = await env.SETTINGS.get(id);
const prefs = await env.PREFS.get(id);
// These patterns are validated as correct:
// Native Web APIs instead of heavy libraries
const response = await fetch(url); // Built-in fetch (0KB)
const now = new Date(); // Native Date (0KB)
// Parallel operations
const [user, settings, prefs] = await Promise.all([
env.USERS.get(id),
env.SETTINGS.get(id),
env.PREFS.get(id),
]);
edge-performance-oracle agentcloudflare-architecture-strategist agentedge-performance-oracle agent// ❌ Critical: Heavy dependencies (150KB+ bundle)
import axios from 'axios'; // 13KB
import moment from 'moment'; // 68KB
import _ from 'lodash'; // 71KB
// Total: 152KB just for utilities!
// ✅ Correct: Native Web APIs (minimal bundle)
// Use fetch instead of axios
const response = await fetch(url);
const data = await response.json();
// Use native Date instead of moment
const now = new Date();
const tomorrow = new Date(Date.now() + 86400000);
// Use native methods instead of lodash
const unique = [...new Set(array)];
const grouped = array.reduce((acc, item) => {
const key = item.category;
if (!acc[key]) acc[key] = [];
acc[key].push(item);
return acc;
}, {});
// Total: < 5KB for utilities
// ❌ High: Sequential KV operations (3x network round-trips)
export default {
async fetch(request: Request, env: Env) {
const user = await env.USERS.get(userId); // 10-30ms
const settings = await env.SETTINGS.get(id); // 10-30ms
const prefs = await env.PREFS.get(id); // 10-30ms
// Total: 30-90ms just for storage!
}
}
// ✅ Correct: Parallel operations (single round-trip)
export default {
async fetch(request: Request, env: Env) {
const [user, settings, prefs] = await Promise.all([
env.USERS.get(userId),
env.SETTINGS.get(id),
env.PREFS.get(id),
]);
// Total: 10-30ms (single round-trip)
}
}
// ❌ Critical: No edge caching (slow globally)
export default {
async fetch(request: Request, env: Env) {
const config = await fetch('https://api.example.com/config');
// Every request goes to origin!
// Sydney user → US origin = 200ms+ just for config
}
}
// ✅ Correct: Edge caching pattern
export default {
async fetch(request: Request, env: Env) {
const cache = caches.default;
const cacheKey = new Request('https://example.com/config', {
method: 'GET'
});
// Try cache first
let response = await cache.match(cacheKey);
if (!response) {
// Cache miss - fetch from origin
response = await fetch('https://api.example.com/config');
// Cache at edge with 1-hour TTL
response = new Response(response.body, {
...response,
headers: {
...response.headers,
'Cache-Control': 'public, max-age=3600',
}
});
await cache.put(cacheKey, response.clone());
}
// Sydney user → Sydney edge cache = < 10ms
return response;
}
}
// ❌ High: Large synchronous processing (CPU time bomb)
export default {
async fetch(request: Request, env: Env) {
const users = await env.DB.prepare('SELECT * FROM users').all();
// If 10,000 users, this loops for 100ms+ CPU time
const enriched = users.results.map(user => {
return {
...user,
fullName: `${user.firstName} ${user.lastName}`,
// ... expensive computations
};
});
}
}
// ✅ Correct: Bounded operations
export default {
async fetch(request: Request, env: Env) {
// Option 1: Limit at database level
const users = await env.DB.prepare(
'SELECT * FROM users LIMIT ? OFFSET ?'
).bind(10, offset).all(); // Only 10 users, bounded CPU
// Option 2: Stream processing for large datasets
const { readable, writable } = new TransformStream();
// Process in chunks without loading everything into memory
// Option 3: Offload to Durable Object
const id = env.PROCESSOR.newUniqueId();
const stub = env.PROCESSOR.get(id);
return stub.fetch(request); // DO can run longer
}
}
When Cloudflare MCP server is available:
// Developer types: npm install moment
// SKILL immediately activates: "❌ CRITICAL: moment is 68KB and will slow cold starts. Use native Date instead for 0KB impact."
// Developer types: sequential KV gets
// SKILL immediately activates: "⚠️ HIGH: Sequential KV operations detected. Use Promise.all() to parallelize and reduce latency by 3x."
// Developer types: fetch without caching
// SKILL immediately activates: "⚠️ HIGH: No edge caching for API call. Add Cache API to serve from edge locations globally."
This SKILL ensures Workers performance by providing immediate, autonomous optimization of performance patterns, preventing common performance issues and ensuring fast global response times.
This skill should be used when the user asks to "create a slash command", "add a command", "write a custom command", "define command arguments", "use command frontmatter", "organize commands", "create command with file references", "interactive command", "use AskUserQuestion in command", or needs guidance on slash command structure, YAML frontmatter fields, dynamic arguments, bash execution in commands, user interaction patterns, or command development best practices for Claude Code.
This skill should be used when the user asks to "create an agent", "add an agent", "write a subagent", "agent frontmatter", "when to use description", "agent examples", "agent tools", "agent colors", "autonomous agent", or needs guidance on agent structure, system prompts, triggering conditions, or agent development best practices for Claude Code plugins.
This skill should be used when the user asks to "create a hook", "add a PreToolUse/PostToolUse/Stop hook", "validate tool use", "implement prompt-based hooks", "use ${CLAUDE_PLUGIN_ROOT}", "set up event-driven automation", "block dangerous commands", or mentions hook events (PreToolUse, PostToolUse, Stop, SubagentStop, SessionStart, SessionEnd, UserPromptSubmit, PreCompact, Notification). Provides comprehensive guidance for creating and implementing Claude Code plugin hooks with focus on advanced prompt-based hooks API.