Help us improve
Share bugs, ideas, or general feedback.
From framer-pack
Optimizes Framer costs with plan selection, CMS usage monitoring in TypeScript, batch publishing, and dev/prod site strategies. For billing analysis and budget management.
npx claudepluginhub jeremylongshore/claude-code-plugins-plus-skills --plugin framer-packHow this skill is triggered — by the user, by Claude, or both
Slash command
/framer-pack:framer-cost-tuningThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
Optimize Framer costs across plans and features. The Server API is free during beta. Main costs are Framer site plans, custom domains, and team seats.
Executes Framer production checklist for plugins, code components, CMS sync, and site publishing. Verifies testing, error handling, security, and readiness before launch.
Expert guidance for Framer design, Framer Motion animations, interactive prototyping, production site building, and CMS/MCP integration. Activates automatically when working on Framer sites or animations.
Optimizes Webflow costs via plan recommendations, free CDN-cached reads, bulk API endpoints, and usage monitoring with alerts. Use for billing analysis or reducing costs in integrations.
Share bugs, ideas, or general feedback.
Optimize Framer costs across plans and features. The Server API is free during beta. Main costs are Framer site plans, custom domains, and team seats.
| Plan | Price | CMS Items | Custom Domain | Pages |
|---|---|---|---|---|
| Free | $0 | 100 | No | 2 |
| Mini | $5/mo | 200 | Yes | 150 |
| Basic | $15/mo | 1,000 | Yes | 300 |
| Pro | $30/mo | 10,000 | Yes | Unlimited |
| Enterprise | Custom | Unlimited | Yes | Unlimited |
// Track CMS item usage to avoid plan overages
async function checkCMSUsage(client: any) {
const collections = await client.getCollections();
let totalItems = 0;
for (const col of collections) {
const items = await col.getItems();
totalItems += items.length;
console.log(`${col.name}: ${items.length} items`);
}
console.log(`Total CMS items: ${totalItems}`);
// Pro plan: 10,000 limit
console.log(`Usage: ${((totalItems / 10000) * 100).toFixed(1)}% of Pro limit`);
}
// Batch CMS updates before publishing (each publish rebuilds the site)
async function batchUpdateAndPublish(updates: Array<{ collection: string; items: any[] }>) {
const client = await getClient();
for (const update of updates) {
const col = (await client.getCollections()).find(c => c.name === update.collection);
if (col) await col.setItems(update.items);
}
// Single publish after all updates
await client.publish();
}
Use a free plan site for development and testing. Only pay for the production site.
For architecture patterns, see framer-reference-architecture.