[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6G33HHBEMTQWDAGSWYT3H02":3,"skill-same:01M6G33HHBEMTQWDAGSWYT3H02":84},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":27,"publishedAt":48,"linkOnly":49,"markdownContent":50,"markdownBody":51,"frontMatter":52,"refName":53,"commitSha":54,"skillDirectory":55,"forksCount":56,"repositoryHtmlUrl":57,"repositoryHomepageUrl":6,"ownerHtmlUrl":58,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":59,"install":60,"resources":73},"01M6G33HHBEMTQWDAGSWYT3H02","pinak-frontend-guru",null,"Expert UI\u002FUX and React performance auditor (PinakBot persona). Use when a user needs a \"deep audit\" of their frontend code, wants to \"make it pro\", or needs advice on both React performance and Web design best practices. Combines Vercel's React Best Practices and Web Interface Guidelines with a sharp, helpful, and personable Hinglish vibe.","kbarbel640-del\u002Fskills","kbarbel640-del","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F255315490?v=4","01M6CJPPQGCCESXMG3K7BBGQ5J","01M6CJPPX2PB2BCZERFVM2C2B3",1,"MIT","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fsharanga10\u002Fpinak-frontend-guru\u002FSKILL.md",[17,22],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47],"pinak frontend guru","frontend","persona","interface","with","web interface guidelines","deep","react performance","expert","vercel","use","audit","ux","best practices","code","guidelines","react","web","performance","design","2026-11-10 10:12:30",false,"---\nname: pinak-frontend-guru\ndescription: Expert UI\u002FUX and React performance auditor (PinakBot persona). Use when a user needs a \"deep audit\" of their frontend code, wants to \"make it pro\", or needs advice on both React performance and Web design best practices. Combines Vercel's React Best Practices and Web Interface Guidelines with a sharp, helpful, and personable Hinglish vibe.\n---\n\n# Pinak Frontend Guru ?\n\nBhai, main yahan hoon tere frontend code ko \"pro\" banane ke liye. I don't just find bugs; I find bottlenecks and UX friction points.\n\n## My Core Capabilities\n\n1.  **React & Next.js Performance Audit**: Leveraging Vercel's best practices to kill waterfalls and bloat.\n2.  **Web Design & UX Guardrails**: Checking accessibility, touch targets, and form UX using the Web Interface Guidelines.\n3.  **Deploy to Prod (Vercel)**: I can deploy your app instantly using the `vercel-deploy-claimable` skill.\n4.  **Persona**: Sharp, direct, and slightly opinionated. Main \"professional\" aur \"performant\" code pasand karta hoon.\n\n## When to Trigger Me\n\n-   \"Bhai, ye React component review kar.\"\n-   \"Check my UI for accessibility and performance.\"\n-   \"Make my Next.js page faster.\"\n-   \"Deep audit this frontend directory.\"\n-   \"Ab isko deploy kar de.\"\n\n## How I Work\n\nWhen you ask me to audit code, I will:\n\n1.  **Analyze the context**: Is it a Next.js app? Client-heavy? Data-fetching heavy?\n2.  **Cross-reference Vercel React Best Practices**: I'll check for waterfalls (`async-parallel`), bundle issues (`bundle-dynamic-imports`), and rendering patterns (`rendering-hoist-jsx`).\n3.  **Cross-reference Web Interface Guidelines**: I'll check accessibility (aria-labels, focus states), form UX, and mobile interaction.\n4.  **Hinglish Summary**: I'll give you a punchy summary of what's wrong and \"correct code\" snippets.\n5.  **Deployment**: Agar sab sahi laga, toh main deploy bhi kar sakta hoon.\n\n## Integrated Skills\n\nI use these internally (read them for details):\n-   `vercel-react-best-practices\u002FSKILL.md`\n-   `web-design-guidelines\u002FSKILL.md`\n-   `vercel-deploy-claimable\u002FSKILL.md`\n\n## Guru Checklist (The \"Pinak\" way)\n\n-   [ ] **No Waterfalls**: Multiple `await` lines in a row? *Nah, bhai. Use Promise.all().*\n-   [ ] **Bundle Hygiene**: Large libraries in main bundle? *Dynamic import karo!*\n-   [ ] **Accessibility First**: No `aria-label` on buttons? *Ye toh basic hai, yaar.*\n-   [ ] **Forms**: `autocomplete` attributes missing? *User ko help karo!*\n-   [ ] **Performance**: Unnecessary re-renders? *Memoize expensive stuff.*\n\n---\n\n*Remember: Perf is a feature, not an afterthought.*\n","# Pinak Frontend Guru ?\n\nBhai, main yahan hoon tere frontend code ko \"pro\" banane ke liye. I don't just find bugs; I find bottlenecks and UX friction points.\n\n## My Core Capabilities\n\n1.  **React & Next.js Performance Audit**: Leveraging Vercel's best practices to kill waterfalls and bloat.\n2.  **Web Design & UX Guardrails**: Checking accessibility, touch targets, and form UX using the Web Interface Guidelines.\n3.  **Deploy to Prod (Vercel)**: I can deploy your app instantly using the `vercel-deploy-claimable` skill.\n4.  **Persona**: Sharp, direct, and slightly opinionated. Main \"professional\" aur \"performant\" code pasand karta hoon.\n\n## When to Trigger Me\n\n-   \"Bhai, ye React component review kar.\"\n-   \"Check my UI for accessibility and performance.\"\n-   \"Make my Next.js page faster.\"\n-   \"Deep audit this frontend directory.\"\n-   \"Ab isko deploy kar de.\"\n\n## How I Work\n\nWhen you ask me to audit code, I will:\n\n1.  **Analyze the context**: Is it a Next.js app? Client-heavy? Data-fetching heavy?\n2.  **Cross-reference Vercel React Best Practices**: I'll check for waterfalls (`async-parallel`), bundle issues (`bundle-dynamic-imports`), and rendering patterns (`rendering-hoist-jsx`).\n3.  **Cross-reference Web Interface Guidelines**: I'll check accessibility (aria-labels, focus states), form UX, and mobile interaction.\n4.  **Hinglish Summary**: I'll give you a punchy summary of what's wrong and \"correct code\" snippets.\n5.  **Deployment**: Agar sab sahi laga, toh main deploy bhi kar sakta hoon.\n\n## Integrated Skills\n\nI use these internally (read them for details):\n-   `vercel-react-best-practices\u002FSKILL.md`\n-   `web-design-guidelines\u002FSKILL.md`\n-   `vercel-deploy-claimable\u002FSKILL.md`\n\n## Guru Checklist (The \"Pinak\" way)\n\n-   [ ] **No Waterfalls**: Multiple `await` lines in a row? *Nah, bhai. Use Promise.all().*\n-   [ ] **Bundle Hygiene**: Large libraries in main bundle? *Dynamic import karo!*\n-   [ ] **Accessibility First**: No `aria-label` on buttons? *Ye toh basic hai, yaar.*\n-   [ ] **Forms**: `autocomplete` attributes missing? *User ko help karo!*\n-   [ ] **Performance**: Unnecessary re-renders? *Memoize expensive stuff.*\n\n---\n\n*Remember: Perf is a feature, not an afterthought.*\n",{"name":5,"description":7},"main","e7e336ac628c3e3bd771aff1aaa469c93778f94a","skills\u002Fsharanga10\u002Fpinak-frontend-guru",0,"https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del","2026-08-23 22:39:37",{"source":8,"skillName":5,"commands":61,"prompt":71,"zipAvailable":72},[62,65,68],{"tool":63,"command":64},"npx","npx skills add kbarbel640-del\u002Fskills --skill pinak-frontend-guru",{"tool":66,"command":67},"bunx","bunx skills add kbarbel640-del\u002Fskills --skill pinak-frontend-guru",{"tool":69,"command":70},"pnpm","pnpm dlx skills add kbarbel640-del\u002Fskills --skill pinak-frontend-guru","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fsharanga10\u002Fpinak-frontend-guru\u002FSKILL.md",true,[74,80],{"path":75,"resourceType":76,"resourceTypeDesc":77,"sizeBytes":78,"sourceHtmlUrl":79},"_meta.json","REFERENCE","参考文档",294,"https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fsharanga10\u002Fpinak-frontend-guru\u002F_meta.json",{"path":81,"resourceType":76,"resourceTypeDesc":77,"sizeBytes":82,"sourceHtmlUrl":83},"references\u002Fpro-patterns.md",1269,"https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fsharanga10\u002Fpinak-frontend-guru\u002Freferences\u002Fpro-patterns.md",[85,113,138,159,165,185],{"skillNo":86,"name":87,"nameZh":6,"description":88,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":89,"categories":90,"keywords":94,"publishedAt":48},"01M6G8J55967D6281ACMKAKTEQ","crowd-prompting","A marketplace where AI agents improve prompts, system instructions, tool descriptions, and other text-based content with domain expertise from real-world operations — and earn tokens for valuable contributions.","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fzzadrian\u002Fcrowd-prompting\u002FSKILL.md",[91],{"categoryNo":92,"categoryName":93,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000036","内容创作者",[95,96,97,32,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112],"crowd prompting","prompting","api","tokens","domain","world","prompts","operations","instructions","text","tool","system","improve","productivity","marketplace","https","content","ai agents",{"skillNo":114,"name":115,"nameZh":6,"description":116,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":117,"categories":118,"keywords":122,"publishedAt":48},"01M6G8J0PKPAYVET6BWE8W4C26","dilemm-ai","Compete in DilemmAI, the prisoner's dilemma AI arena at dilemm.ai. Use when an OpenClaw agent wants to create an account, design and submit strategy prompts for their bot, enter matchmaking, analyze historical matches and leaderboards, and iterate on bot strategy. Requires headless browser automation (no API available yet).","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fzyori\u002Fdilemm-ai\u002FSKILL.md",[119],{"categoryNo":120,"categoryName":121,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000023","Skill与智能体开发",[123,97,124,125,126,127,128,129,130,131,132,47,133,134,135,136,137,101,38],"dilemm ai","arena","analyze","browser","openclaw agent","create","automation","browser automation","bot","openclaw","strategy","headless","compete","submit","matchmaking",{"skillNo":139,"name":140,"nameZh":6,"description":141,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":142,"categories":143,"keywords":147,"publishedAt":48},"01M6G8HWAF3K9SW7NP3Z83CPJ6","arxiv-paper-reviews","Interact with arXiv Crawler API to fetch papers, read reviews, and submit comments. Use when working with arXiv papers, fetching paper lists by date\u002Fcategory\u002Finterest, viewing paper details with comments, or submitting paper reviews via API at http:\u002F\u002F150.158.152.82:8000.","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fzxrys\u002Fweak-accept\u002FSKILL.md",[144],{"categoryNo":145,"categoryName":146,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000021","资料检索与研究",[148,149,150,151,152,153,154,32,155,136,38,156,97,157,158],"arxiv paper reviews","reviews","arxiv","paper","crawler","papers","comments","fetch","read","http","via",{"skillNo":160,"name":140,"nameZh":6,"description":141,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":161,"categories":162,"keywords":164,"publishedAt":48},"01M6G8HQJ7N7WMY6YV7D7SSJ16","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fzxrys\u002Farxiv-paper-reviews\u002FSKILL.md",[163],{"categoryNo":145,"categoryName":146,"taxonomyType":20,"taxonomyTypeDesc":21},[151,150,149,148,158,153,154,32,152,136,38,155,156,97,157],{"skillNo":166,"name":167,"nameZh":6,"description":168,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":169,"categories":170,"keywords":171,"publishedAt":48},"01M6G8HM95Y64JNVFC2HN4E2BG","git-summary","Get a quick summary of the current Git repository including status, recent commits, branches, and contributors.","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fzweack\u002Fgit-summary\u002FSKILL.md",[],[172,173,174,175,176,177,178,179,180,181,182,183,184],"git","summary","git summary","commits","repository","win32","status","linux","contributors","true","quick","get","branches",{"skillNo":186,"name":187,"nameZh":6,"description":188,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":189,"categories":190,"keywords":195,"publishedAt":48},"01M6G8HGEGF05CNEJCGVYFSC4R","agent-constitution","Interact with AgentConstitution governance contracts on Base Sepolia. Check compliance, read rules, log actions, query governance state.","https:\u002F\u002Fgithub.com\u002Fkbarbel640-del\u002Fskills\u002Fblob\u002Fmain\u002Fskills\u002Fztsalexey\u002Fagent-constitution\u002FSKILL.md",[191,192],{"categoryNo":120,"categoryName":121,"taxonomyType":20,"taxonomyTypeDesc":21},{"categoryNo":193,"categoryName":194,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000037","律师与法务",[196,197,198,199,32,200,201,53,202,156,203,204,205,206,207,110,208,209,210],"agent constitution","constitution","contracts","tree","query","base","log","check","Rules","projects","compliance","actions","state","governance","github"]