[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M71H8D51YVTWHCKPZW5A39EP":3,"skill-same:01M71H8D51YVTWHCKPZW5A39EP":56},{"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":17,"publishedAt":31,"linkOnly":32,"markdownContent":33,"markdownBody":34,"frontMatter":35,"refName":36,"commitSha":37,"skillDirectory":38,"forksCount":13,"repositoryHtmlUrl":39,"repositoryHomepageUrl":6,"ownerHtmlUrl":40,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":41,"install":42,"resources":55},"01M71H8D51YVTWHCKPZW5A39EP","02-anti-patterns",null,"Effect-TS 4 anti-patterns — plain generators, .pipe after Effect.fn, ServiceMap, catchAll, for loops, and type pitfalls","lambda-solver\u002Flambdabench-pro","lambda-solver","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F279071046?v=4","01M71H55W2WK3PM6RRAY9JZWAJ","01M71H55WRT9XAFDAVACTCC2XP",0,"MIT","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Feffect-ts\u002Fpatterns\u002F02-anti-patterns\u002FSKILL.md",[],[18,19,20,21,22,23,24,25,26,27,28,29,30],"02 anti patterns","anti patterns","patterns","effect","for","fn","type","loops","pipe","opencode","anti-patterns","pitfalls","plain","2026-11-10 10:12:30",false,"---\nname: 02-anti-patterns\ndescription: Effect-TS 4 anti-patterns — plain generators, .pipe after Effect.fn, ServiceMap, catchAll, for loops, and type pitfalls\nlicense: MIT\ncompatibility: opencode\n---\n\n# Anti-Patterns to Avoid\n\n## ❌ Plain function returning Effect.gen\n\n```typescript\n\u002F\u002F ❌ no tracing, no stack frames\nexport const fetchUser = (id: string) =>\n  Effect.gen(function* () {\n    return yield* db.query(id);\n  });\n\n\u002F\u002F ✅ use Effect.fn for exported functions\nexport const fetchUser = Effect.fn(\"fetchUser\")(function* (id: string) {\n  return yield* db.query(id);\n});\n\n\u002F\u002F ✅ use Effect.fnUntraced for internal helpers\nconst buildPayload = Effect.fnUntraced(function* (id: string) {\n  return yield* db.query(id);\n});\n```\n\n## ❌ .pipe after Effect.fn\n\n```typescript\n\u002F\u002F ❌ operators in .pipe lose the span's argument context\nexport const fn = Effect.fn(\"fn\")(function* () { ... })\n  .pipe(Effect.withSpan(\"fn\"))\n\n\u002F\u002F ✅ extra operators as additional args to Effect.fn\nexport const fn = Effect.fn(\"fn\")(\n  function* () { ... },\n  Effect.withSpan(\"fn\"),\n)\n```\n\n## ❌ ServiceMap.Service\n\nThe reference codebase (effect-smol) uses only `Context.Service`.\n`ServiceMap.Service` may be removed or renamed in future betas.\n\n```typescript\n\u002F\u002F ❌ outdated\nexport class Database extends ServiceMap.Service\u003CDatabase, { ... }>()(\n  \"myapp\u002FDatabase\",\n) {}\n\n\u002F\u002F ✅ canonical\nexport class Database extends Context.Service\u003CDatabase, { ... }>()(\n  \"myapp\u002FDatabase\",\n) {}\n```\n\n## ❌ Effect.catchAll — does not exist in Effect 4\n\n```typescript\n\u002F\u002F ❌ compile error\nprogram.pipe(Effect.catchAll((e) => Effect.succeed(\"fallback\")));\n\n\u002F\u002F ✅ correct\nprogram.pipe(Effect.catch((_e) => Effect.succeed(\"fallback\")));\n```\n\n## ❌ Effect.iterate — does not exist in Effect 4\n\n```typescript\n\u002F\u002F ❌ runtime error\nyield *\n  Effect.iterate(0, {\n    while: (n) => n \u003C 10,\n    body: (n) => Effect.succeed(n + 1),\n  });\n\n\u002F\u002F ✅ use Effect.suspend for recursive loops\nconst loop = (n: number): Effect.Effect\u003Cnumber> => (n >= 10 ? Effect.succeed(n) : Effect.suspend(() => loop(n + 1)));\n```\n\n## ❌ Plain class service returned as a plain object\n\n```typescript\n\u002F\u002F ❌ breaks Context.Service prototype chain\nreturn { query, findById };\n\n\u002F\u002F ✅\nreturn Database.of({ query, findById });\n```\n\n## ❌ Missing return before yield\\* error\n\n```typescript\n\u002F\u002F ❌ TS doesn't know execution stops — infers wrong type\nfunction* (id: string) {\n  if (!id) yield* new NotFoundError()\n  return yield* fetch(id)     \u002F\u002F inferred as possibly executing after error\n}\n\n\u002F\u002F ✅ return narrows correctly\nfunction* (id: string) {\n  if (!id) return yield* new NotFoundError()\n  return yield* fetch(id)\n}\n```\n\n## ❌ try\u002Fcatch inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ escapes the error channel — errors silently disappear\nEffect.gen(function* () {\n  try {\n    return yield* riskyEffect;\n  } catch (e) {\n    return defaultValue;\n  }\n});\n\n\u002F\u002F ✅ keep errors inside the channel\nriskyEffect.pipe(Effect.catchTag(\"MyError\", (_e) => Effect.succeed(defaultValue)));\n```\n\n## ❌ async\u002Fawait inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ mixes runtimes — promise errors escape the channel\nEffect.gen(function* () {\n  const data = await fetch(url).then((r) => r.json());\n  return data;\n});\n\n\u002F\u002F ✅ use Effect.tryPromise\nEffect.gen(function* () {\n  return yield* Effect.tryPromise({\n    try: () => fetch(url).then((r) => r.json()),\n    catch: (e) => new FetchError({ cause: e }),\n  });\n});\n```\n\n## ❌ let reassignment inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ mutation obscures control flow\nconst program = Effect.gen(function* () {\n  let top: ReadonlyArray\u003CModel>;\n  if (devMode) top = yield* devModels();\n  else top = yield* prodModels();\n  return top;\n});\n\n\u002F\u002F ✅ extract helper, bind once with const\nconst resolveModels = (devMode: boolean) => (devMode ? devModels() : prodModels());\n\nconst program = Effect.gen(function* () {\n  const top = yield* resolveModels(devMode);\n  return top;\n});\n```\n\n## ❌ for loops inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ imperative loop with mutation\nconst results = [];\nfor (const item of items) {\n  results.push(yield * processItem(item));\n}\n\n\u002F\u002F ✅ Effect.forEach\nconst results = yield * Effect.forEach(items, processItem, { concurrency: 4 });\n```\n\n## ❌ Schema.Record with object syntax\n\n```typescript\nSchema.Record({ key: Schema.String, value: Schema.Number }); \u002F\u002F ❌ Effect 3 style\nSchema.Record(Schema.String, Schema.Number); \u002F\u002F ✅ Effect 4\n```\n\n## ❌ Platform imports in domain package\n\n```typescript\n\u002F\u002F ❌ domain package must only import from \"effect\"\nimport { HttpClient } from \"effect\u002Funstable\u002Fhttp\"; \u002F\u002F in packages\u002Fdomain\u002F\n\n\u002F\u002F ✅ platform imports belong in apps\u002F only\nimport { HttpClient } from \"effect\u002Funstable\u002Fhttp\"; \u002F\u002F in apps\u002Fclient\u002F or apps\u002Fserver\u002F\n```\n","# Anti-Patterns to Avoid\n\n## ❌ Plain function returning Effect.gen\n\n```typescript\n\u002F\u002F ❌ no tracing, no stack frames\nexport const fetchUser = (id: string) =>\n  Effect.gen(function* () {\n    return yield* db.query(id);\n  });\n\n\u002F\u002F ✅ use Effect.fn for exported functions\nexport const fetchUser = Effect.fn(\"fetchUser\")(function* (id: string) {\n  return yield* db.query(id);\n});\n\n\u002F\u002F ✅ use Effect.fnUntraced for internal helpers\nconst buildPayload = Effect.fnUntraced(function* (id: string) {\n  return yield* db.query(id);\n});\n```\n\n## ❌ .pipe after Effect.fn\n\n```typescript\n\u002F\u002F ❌ operators in .pipe lose the span's argument context\nexport const fn = Effect.fn(\"fn\")(function* () { ... })\n  .pipe(Effect.withSpan(\"fn\"))\n\n\u002F\u002F ✅ extra operators as additional args to Effect.fn\nexport const fn = Effect.fn(\"fn\")(\n  function* () { ... },\n  Effect.withSpan(\"fn\"),\n)\n```\n\n## ❌ ServiceMap.Service\n\nThe reference codebase (effect-smol) uses only `Context.Service`.\n`ServiceMap.Service` may be removed or renamed in future betas.\n\n```typescript\n\u002F\u002F ❌ outdated\nexport class Database extends ServiceMap.Service\u003CDatabase, { ... }>()(\n  \"myapp\u002FDatabase\",\n) {}\n\n\u002F\u002F ✅ canonical\nexport class Database extends Context.Service\u003CDatabase, { ... }>()(\n  \"myapp\u002FDatabase\",\n) {}\n```\n\n## ❌ Effect.catchAll — does not exist in Effect 4\n\n```typescript\n\u002F\u002F ❌ compile error\nprogram.pipe(Effect.catchAll((e) => Effect.succeed(\"fallback\")));\n\n\u002F\u002F ✅ correct\nprogram.pipe(Effect.catch((_e) => Effect.succeed(\"fallback\")));\n```\n\n## ❌ Effect.iterate — does not exist in Effect 4\n\n```typescript\n\u002F\u002F ❌ runtime error\nyield *\n  Effect.iterate(0, {\n    while: (n) => n \u003C 10,\n    body: (n) => Effect.succeed(n + 1),\n  });\n\n\u002F\u002F ✅ use Effect.suspend for recursive loops\nconst loop = (n: number): Effect.Effect\u003Cnumber> => (n >= 10 ? Effect.succeed(n) : Effect.suspend(() => loop(n + 1)));\n```\n\n## ❌ Plain class service returned as a plain object\n\n```typescript\n\u002F\u002F ❌ breaks Context.Service prototype chain\nreturn { query, findById };\n\n\u002F\u002F ✅\nreturn Database.of({ query, findById });\n```\n\n## ❌ Missing return before yield\\* error\n\n```typescript\n\u002F\u002F ❌ TS doesn't know execution stops — infers wrong type\nfunction* (id: string) {\n  if (!id) yield* new NotFoundError()\n  return yield* fetch(id)     \u002F\u002F inferred as possibly executing after error\n}\n\n\u002F\u002F ✅ return narrows correctly\nfunction* (id: string) {\n  if (!id) return yield* new NotFoundError()\n  return yield* fetch(id)\n}\n```\n\n## ❌ try\u002Fcatch inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ escapes the error channel — errors silently disappear\nEffect.gen(function* () {\n  try {\n    return yield* riskyEffect;\n  } catch (e) {\n    return defaultValue;\n  }\n});\n\n\u002F\u002F ✅ keep errors inside the channel\nriskyEffect.pipe(Effect.catchTag(\"MyError\", (_e) => Effect.succeed(defaultValue)));\n```\n\n## ❌ async\u002Fawait inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ mixes runtimes — promise errors escape the channel\nEffect.gen(function* () {\n  const data = await fetch(url).then((r) => r.json());\n  return data;\n});\n\n\u002F\u002F ✅ use Effect.tryPromise\nEffect.gen(function* () {\n  return yield* Effect.tryPromise({\n    try: () => fetch(url).then((r) => r.json()),\n    catch: (e) => new FetchError({ cause: e }),\n  });\n});\n```\n\n## ❌ let reassignment inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ mutation obscures control flow\nconst program = Effect.gen(function* () {\n  let top: ReadonlyArray\u003CModel>;\n  if (devMode) top = yield* devModels();\n  else top = yield* prodModels();\n  return top;\n});\n\n\u002F\u002F ✅ extract helper, bind once with const\nconst resolveModels = (devMode: boolean) => (devMode ? devModels() : prodModels());\n\nconst program = Effect.gen(function* () {\n  const top = yield* resolveModels(devMode);\n  return top;\n});\n```\n\n## ❌ for loops inside Effect.gen\n\n```typescript\n\u002F\u002F ❌ imperative loop with mutation\nconst results = [];\nfor (const item of items) {\n  results.push(yield * processItem(item));\n}\n\n\u002F\u002F ✅ Effect.forEach\nconst results = yield * Effect.forEach(items, processItem, { concurrency: 4 });\n```\n\n## ❌ Schema.Record with object syntax\n\n```typescript\nSchema.Record({ key: Schema.String, value: Schema.Number }); \u002F\u002F ❌ Effect 3 style\nSchema.Record(Schema.String, Schema.Number); \u002F\u002F ✅ Effect 4\n```\n\n## ❌ Platform imports in domain package\n\n```typescript\n\u002F\u002F ❌ domain package must only import from \"effect\"\nimport { HttpClient } from \"effect\u002Funstable\u002Fhttp\"; \u002F\u002F in packages\u002Fdomain\u002F\n\n\u002F\u002F ✅ platform imports belong in apps\u002F only\nimport { HttpClient } from \"effect\u002Funstable\u002Fhttp\"; \u002F\u002F in apps\u002Fclient\u002F or apps\u002Fserver\u002F\n```\n",{"name":5,"license":14,"description":7,"compatibility":27},"main","816c073aaf171300af3605b06f7ec5aa7370ef0b","reference\u002Fghui\u002F.opencode\u002Fskills\u002Feffect-ts\u002Fpatterns\u002F02-anti-patterns","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro","https:\u002F\u002Fgithub.com\u002Flambda-solver","2026-05-31 17:08:46",{"source":8,"skillName":5,"commands":43,"prompt":53,"zipAvailable":54},[44,47,50],{"tool":45,"command":46},"npx","npx skills add lambda-solver\u002Flambdabench-pro --skill 02-anti-patterns",{"tool":48,"command":49},"bunx","bunx skills add lambda-solver\u002Flambdabench-pro --skill 02-anti-patterns",{"tool":51,"command":52},"pnpm","pnpm dlx skills add lambda-solver\u002Flambdabench-pro --skill 02-anti-patterns","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Feffect-ts\u002Fpatterns\u002F02-anti-patterns\u002FSKILL.md",true,[],[57,87,106,125,146,164],{"skillNo":58,"name":59,"nameZh":6,"description":60,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":61,"categories":62,"keywords":68,"publishedAt":31},"01M71H9FNA5D6Y4ANXD18Z1Z3X","tmux-workflow","Development workflow with tmux — run dev servers, Storybook, and background processes in persistent sessions with live logs, while keeping OpenCode free for chat","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Ftmux\u002FSKILL.md",[63],{"categoryNo":64,"categoryName":65,"taxonomyType":66,"taxonomyTypeDesc":67},"01JBSEEDCAT000000000000023","Skill与智能体开发","SCENARIO","使用场景",[69,70,71,72,73,74,75,76,77,78,79,27,80,81,82,83,84,85,22,86],"tmux","workflow","tmux workflow","chat","dev servers","background","processes","storybook","live","servers","run","with","logs","development workflow","free","dev","sessions","development",{"skillNo":88,"name":89,"nameZh":6,"description":90,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":91,"categories":92,"keywords":96,"publishedAt":31},"01M71H9DQJDAJVZX37NDN99D3P","04-anti-patterns","React anti-patterns to avoid — manual JSX repetition, useEffect misuse, reference instability, prop drilling, conditional hooks, and common performance traps","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Freact\u002Fpatterns\u002F04-anti-patterns\u002FSKILL.md",[93],{"categoryNo":94,"categoryName":95,"taxonomyType":66,"taxonomyTypeDesc":67},"01JBSEEDCAT000000000000009","前端开发",[20,19,97,98,99,100,101,102,103,104,28,27,105],"04 anti patterns","common","jsx","reference","conditional","hooks","manual","performance","react",{"skillNo":107,"name":108,"nameZh":6,"description":109,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":110,"categories":111,"keywords":113,"publishedAt":31},"01M71H9BXF511W2R3B73S5P9ZN","03-state-management","React state management patterns — lifting state, colocation, URL state, server state with TanStack Query, local state with useState\u002FuseReducer","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Freact\u002Fpatterns\u002F03-state-management\u002FSKILL.md",[112],{"categoryNo":94,"categoryName":95,"taxonomyType":66,"taxonomyTypeDesc":67},[114,115,116,117,105,118,20,119,120,121,122,27,123,80,124],"management","state management","state","03 state management","query","URL","tanstack","react state management","local","server","tanstack query",{"skillNo":126,"name":127,"nameZh":6,"description":128,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":129,"categories":130,"keywords":132,"publishedAt":31},"01M71H9AAGVWMYQ4NG82QPYCTE","02-component-composition","React component composition patterns — render props, compound components, list rendering with map, slot patterns, and layout primitives","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Freact\u002Fpatterns\u002F02-component-composition\u002FSKILL.md",[131],{"categoryNo":94,"categoryName":95,"taxonomyType":66,"taxonomyTypeDesc":67},[133,134,135,27,80,136,137,105,138,20,139,140,141,142,143,144,145],"02 component composition","component","Composition","compound","components","primitives","composition patterns","list","map","rendering","render","react component","layout",{"skillNo":147,"name":148,"nameZh":6,"description":149,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":150,"categories":151,"keywords":153,"publishedAt":31},"01M71H98RDXRQZDR496SRD906M","01-fp-style","React functional programming style — pure components, hooks conventions, Effect Atom integration, and Tailwind patterns","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Freact\u002Fpatterns\u002F01-fp-style\u002FSKILL.md",[152],{"categoryNo":94,"categoryName":95,"taxonomyType":66,"taxonomyTypeDesc":67},[154,155,156,20,157,158,27,159,105,160,137,102,161,162,163,21],"01 fp style","style","atom","conventions","integration","functional","programming","Tailwind","tailwind patterns","functional programming",{"skillNo":165,"name":166,"nameZh":6,"description":167,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":168,"categories":169,"keywords":171,"publishedAt":31},"01M71H95PYGAWBS5C8KN0C4WGT","react-animation","React animation with react\u002Fmotion (Framer Motion) — declarative animations, gestures, layout animations, and performance best practices","https:\u002F\u002Fgithub.com\u002Flambda-solver\u002Flambdabench-pro\u002Fblob\u002Fmain\u002Freference\u002Fghui\u002F.opencode\u002Fskills\u002Freact\u002Fanimation\u002FSKILL.md",[170],{"categoryNo":94,"categoryName":95,"taxonomyType":66,"taxonomyTypeDesc":67},[105,172,173,104,174,27,145,175,176,80,177,178,179,180],"react animation","Animation","framer motion","motion","best practices","framer","gestures","animations","declarative"]