mirror of
https://github.com/affaan-m/everything-claude-code.git
synced 2026-06-13 03:33:15 +08:00
feat(ja-JP): add skill sub-reference translations (angular, remotion, etc.)
Translated 85 skill sub-reference files to achieve full parity with the English source: - skills/angular-developer/references/ — 35 files (all references) - skills/remotion-video-creation/rules/ — 28 files (all rules) - skills/tinystruct-patterns/references/ — 5 files - skills/openclaw-persona-forge/references/ — 6 files - skills/skill-comply/prompts/ — 3 files - skills/lead-intelligence/agents/ — 4 files - skills/brand-voice/references/ — 1 file - skills/frontend-slides/ — 2 files - hooks/memory-persistence/README.md — 1 file English source parity: 0 missing files (excluding rules/zh/, internal docs, and experimental examples absent from zh-CN)
This commit is contained in:
@@ -0,0 +1,61 @@
|
||||
# ルート読み込み戦略
|
||||
|
||||
Angular は、初期読み込み時間とナビゲーションの応答性のバランスを取るために、ルートとコンポーネントの読み込みに関する2つの主要な戦略をサポートしています。
|
||||
|
||||
## イーガーローディング(Eager Loading)
|
||||
|
||||
コンポーネントは初期 JavaScript ペイロードにバンドルされ、即座に利用可能になります。
|
||||
|
||||
```ts
|
||||
{ path: 'home', component: Home }
|
||||
```
|
||||
|
||||
- **メリット**:シームレスなトランジション。
|
||||
- **デメリット**:初期バンドルサイズが増加する。
|
||||
|
||||
## レイジーローディング(Lazy Loading)
|
||||
|
||||
コンポーネントやルートは、ユーザーが画面に遷移したときにのみ読み込まれます。これにより JavaScript の独立した「チャンク」が生成されます。
|
||||
|
||||
### コンポーネントのレイジーローディング
|
||||
|
||||
`loadComponent` を使用して、コンポーネントをオンデマンドで取得します。
|
||||
|
||||
```ts
|
||||
{
|
||||
path: 'admin',
|
||||
loadComponent: () => import('./admin/admin.component').then(m => m.AdminComponent)`,
|
||||
}
|
||||
```
|
||||
|
||||
### 子ルートのレイジーローディング
|
||||
|
||||
`loadChildren` を使用して、ルートのセットを取得します。
|
||||
|
||||
```ts
|
||||
{
|
||||
path: 'settings',
|
||||
loadChildren: () => import('./settings/settings.routes'),
|
||||
}
|
||||
```
|
||||
|
||||
## インジェクションコンテキストとレイジーローディング
|
||||
|
||||
ローダー関数は現在のルートの**インジェクションコンテキスト**内で実行されます。これにより `inject()` を呼び出して、コンテキストを考慮した読み込み判断が可能になります。
|
||||
|
||||
```ts
|
||||
{
|
||||
path: 'dashboard',
|
||||
loadComponent: () => {
|
||||
const flags = inject(FeatureFlags);
|
||||
return flags.isPremium
|
||||
? import('./premium-dashboard')
|
||||
: import('./basic-dashboard');
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
## 推奨事項
|
||||
|
||||
- メインのランディングページには**イーガーローディング**を使用する。
|
||||
- 初期バンドルを小さく保つために、その他のすべての機能領域には**レイジーローディング**を使用する。
|
||||
Reference in New Issue
Block a user