フロントエンド

💻 IT・テクノロジー — 全 14 件

Web Components1年本番運用で踏んだ地雷——Shadow DOMとTailwindの相性問題から本当の使い道まで

Web Componentsを1年間本番運用してわかった、Shadow DOMの落とし穴とTailwind CSSとの相性問題。フレームワーク連携の現実と、実装例で見つけた本当の使い道を実体験から解説します。

3年半運用してきたプロジェクトのAPIクライアント設計を TypeScript 5.8 で書き直したら、型エラーで防げるバグが劇的に増えた。実務で効いた知見を共有します。

Server Componentsのキャッシュ戦略に泣かされた。本番運用6ヶ月で見つけた落とし穴と、うちが実装した対策をコード付きで共有します。

機能追加のたびにじわじわ悪化するCWV、経験ありませんか？LCP・INP・CLSが本番で崩壊した実例と、チームで3ヶ月かけて立て直した記録をそのまま残しておきます。

「元に戻したい」と言い出したチームメンバーもいたあの混乱期から半年。CSS変数ベースの新設計に慣れるまでの実体験と、本番でハマった落とし穴をそのまま書きました。

「Web Componentsって今どき使う意義ある？」そんな疑問、うちのチームも持ってました。React・Vue・jQueryが混在する環境で1年運用して見えたShadow DOMの罠とLit 3.xの実際。

「v3からそんなに変わらんやろ」と思って痛い目を見た話。Oxide Engine・@theme・Lightning CSS統合を実務で半年使い続けて気づいたことを正直に書きます。

「型安全性は開発を遅くするのでは？」という懸念は見事に外れました。3年のチーム運用で体感したTypeScriptのメリット、バグ削減から設計の質向上まで、実務知見をお話しします。

本番運用6ヶ月でメモリ80%まで急上昇。ISR・revalidatePatternの実装ミス、Server Componentsのデータフェッチ設計の失敗を実体験から解説します。

「標準仕様だから安心」と思って導入したら想像以上に癖があった。複数フレームワーク横断のデザインシステムを1年運用して気づいた、Web Componentsのリアルな使いどころと失敗談。

SOC2審査で発覚したアクセシビリティ地獄。後付けに3倍の工数がかかった失敗から学んだ、実装フェーズから組み込むべき設計パターンをコード例で紹介。

「設定ファイルが変わる程度でしょ」と思ってたら甘かった。v4導入で最初の2週間チームが苦労した話と、3ヶ月後に「早く入れればよかった」と感じた理由を実コードで振り返ります。