Diagnose Web Performance Bottlenecks
Slow loading and delayed interactions require different fixes, and laboratory scores can hide real user problems. This skill guides measurement and targeted browser performance improvements.
将此请求复制给你的智能体，其中包含权威 Skill 页面和清单。
Review the Skillstore skill "web-performance" from https://skillstore.io/skills/shreyam1008-web-performance.md and its manifest at https://skillstore.io/api/skills/shreyam1008-web-performance/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.你的智能体仍应展示其计划，并按安全策略请求必要确认。
当 AI Agent、爬虫或脚本需要干净上下文，而不是读取完整页面时，请使用这些链接。
正在使用“web-performance”。 My product page has field LCP of 3.4 seconds. The waterfall shows the hero image is discovered late.
预期结果:
正在使用“web-performance”。 My animation stutters. The trace shows geometry reads after style writes, and the loop assumes 60Hz.
预期结果:
All 22 static findings are false positives in browser performance guidance. Backticks mark Markdown formatting, while reconnaissance matches describe rendering stages and DOM layout measurements. No evidence found of shell execution, host reconnaissance, data exfiltration, or prompt injection in the reviewed SKILL.md.
分享版本化评估报告、中性徽章、嵌入卡片和引用。Skillstore 只报告证据，不判断该 Skill 是否安全。
https://skillstore.io/skills/shreyam1008-web-performance/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/shreyam1008-web-performance?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/shreyam1008-web-performance?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/shreyam1008-web-performance/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/shreyam1008-web-performance.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>shreyam1008. (2026). web-performance security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/shreyam1008-web-performance/audits/1@techreport{shreyam1008-shreyam1008-web-performance-2026,
author = {shreyam1008},
title = {web-performance security audit report (audit version 1)},
institution = {Skillstore},
year = {2026},
number = {1},
url = {https://skillstore.io/skills/shreyam1008-web-performance/audits/1},
note = {Author version unspecified}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "web-performance security audit report (audit version 1)"
version: "unspecified"
type: report
authors:
- name: "shreyam1008"
date-released: "2026-10-02"
url: "https://skillstore.io/skills/shreyam1008-web-performance/audits/1"
identifiers:
- type: other
value: "skillstore:shreyam1008-web-performance:audit:1"
description: "Skillstore immutable audit report identifier"
Prioritize the measured LCP resource and reduce blocking scripts, oversized images, and font delays on product pages.
Use interaction traces to separate input delay, handler work, and presentation delay before selecting targeted fixes.
Review animation scheduling, layout reads and writes, and frame timing across display refresh rates.
Review these LCP, INP, and CLS measurements: [measurements]. Explain the targets and identify what additional field or laboratory evidence is needed.
Review this loading trace and resource waterfall: [evidence]. Identify the LCP resource, blocking work, and three prioritized changes with validation steps.
Analyze this interaction trace: [trace]. Separate input delay, handler work, and presentation delay. Recommend measured fixes and supported scheduling fallbacks.
Review this animation loop and traces: [evidence]. Compare 60Hz and 120Hz budgets, layout batching, worker opportunities, and GPU constraints. Define regression checks.
作者
shreyam1008许可证
MIT
Skillstore 修订
r1
版本提示
作者未声明版本。
引用
bbec03cf10354f3aaccd6dd24eda4ac9ceeceac5
维护新鲜度
2026/10/2
使用量
0 次下载 · 0 次浏览
文件结构
📄 SKILL.md
Embed Web Content in WinUI 3 with WebView2
Embedding web interfaces in Windows desktop apps requires careful initialization, messaging, and asset packaging. This skill guides WebView2 integration with local content mapping and explicit security boundaries.
Build and Debug Browser WebGPU Pipelines
Browser GPU workloads can fail across devices or lose performance through inefficient resource handling. This skill guides WebGPU implementation with capability checks, usable fallbacks, validation, and targeted measurement.
Build and Debug Raw WebGL Rendering
Raw WebGL rendering can slow down through excessive draw calls, state changes, and texture bandwidth. This skill guides context setup, resource handling, and targeted optimization.
Build Rust WebAssembly Modules for the Browser
Compute-heavy browser workloads can suffer from JavaScript processing costs and frequent data transfers. This skill guides Rust WebAssembly integration and optimization based on measured bottlenecks.
Build and Debug vgpu Visuals
GPU visuals can fail when shader APIs, package versions, and application lifecycles do not align. This skill guides version-aware vgpu development, integration, performance measurement, and validation.
Build Reliable TanStack Data and Routing
Duplicated server state and inconsistent query keys can cause stale data and unnecessary requests. This skill guides TanStack patterns for caching, mutations, routing, and rendering.
实现 React View Transitions
由 vercel-labs
React 视图过渡很容易放错位置，从而导致无提示或嘈杂的动画。此技能可指导路由、Suspense、列表和共享元素动画的选择。
修复动画性能问题
由 ibelick
卡顿的动画会损害可用性，并让界面显得缓慢。此技能指导 Claude、Codex 和 Claude Code 查找动效瓶颈并提出有针对性的修复方案。
使用 Resend 构建 React Email 模板
由 resend
创建可用于生产环境的电子邮件模板并不容易，因为各个邮件客户端存在差异。此技能会指导 Claude、Codex 和 Claude Code 完成 React Email 组件、发送、样式、本地化和编辑器工作流。
改进 Vue 3 TypeScript 实践
由 hyf0
Vue TypeScript 项目经常遇到令人困惑的模板、路由器和 Volar 错误。此技能为 Codex、Claude 和 Claude Code 提供有针对性的 Vue 3 修复方案。
改进 Vue Options API 组件
由 vuejs-ai
Vue Options API 项目可能会失去类型安全性和正确的 this 绑定。此技能提供更安全 Vue 组件的直接模式。
构建可用于生产的前端功能
由 davila7
前端团队需要在各项目中获得一致的 React 和 Next.js 指导。此技能提供用于前端分析的参考工作流、质量实践和辅助脚本。