Nx CloudでCIを爆速にした話

TechBrew 〜 一杯のお酒で繋がるエンジニアたち〜@福岡

Transcript

1. Nx CloudでCIを爆速にした話
   TechBrew 〜 一杯のお酒で繋がるエンジニアたち〜@福岡
   @puku0x
   Noriyuki Shinpuku
   

   View Slide

2. @puku0x 2
   

   View Slide

3. @puku0x 3
   CIにどれぐらい時間がかかっていますか？
   

   View Slide

4. @puku0x
   成長のジレンマ
   4
   機能追加 コード量 増 CI時間 増
   

   View Slide

5. @puku0x 5
   CIが遅いとどうなる？
   

   View Slide

6. @puku0x
   レビューが遅くなる
   6
   20分後でいいや
   

   View Slide

7. @puku0x 7
   ブランチの生存期間が
   延びるとどうなる？
   

   View Slide

8. @puku0x
   コンフリクトが増える
   8
   

   View Slide

9. @puku0x 9
   CI高速化がカギ
   

   View Slide

10. @puku0x
    CI高速化のテクニック
    ● キャッシュの活用
    ~/.npm や node_modules 等をキャッシュ
    ● 変更検知
    影響範囲のコードのみ実行
    10
    その他: ジョブ並列化、仮想マシンのグレードアップ等
    

    View Slide

11. node_modulesのキャッシュ
    11
    strategy:
    matrix:
    node: ['16', '18']
    steps:
    - uses: actions/cache@v3
    id: cache
    with:
    path: node_modules
    key: ${{ runner.os }}-node-${{ matrix.node }}-npm-${{ hashFiles('**/package-lock.json') }
    

    View Slide

12. - uses: actions/cache@v3
    if: steps.cache.outputs.cache-hit != 'true'
    with:
    path: |
    ~/.npm
    ~/.cache/Cypress
    key: ${{ runner.os }}-node-${{ matrix.node }}-npm-${{ hashFiles('**/package-lock.json') }
    restore-keys: |
    ${{ runner.os }}-node-${{ matrix.node }}-npm-
    - name: Install dependencies
    if: steps.cache.outputs.cache-hit != 'true'
    run: npm ci
    他のディレクトリのキャッシュ
    12
    

    View Slide

13. @puku0x 13
    https://nx.dev/
    

    View Slide

14. @puku0x
    Nx + Nx Cloud
    ● nx affected による変更検知
    ● Nx Cloudによるリモートキャッシュ
    ○ CI時間平均 約10分 → 約5分
    ※最短で1分未満
    14
    

    View Slide

15. @puku0x 15
    

    View Slide

16. @puku0x 16
    300時間/月 以上を削減！
    

    View Slide

17. @puku0x 17
    https://speakerdeck.com/puku0x/findynohurontoendoshe-ji-shua-xin-wotong-sitede-raretaji-shu-de-fu-zhai-tonoxiang-kihe-ifang
    

    View Slide

18. @puku0x
    Nxはいいぞ
    @puku0x
    Noriyuki Shinpuku
    

    View Slide