---
title: GitHub Actionsのビルド&デプロイに時間がかかってしまいます。解決方法はありますか？
description: GitHub Actionsのビルド&デプロイに時間がかかってしまう要因として、以下が考えられます。
category: trouble
---

import StructuredDataFaqs from '@site/src/components/StructuredDataFaqs';

<StructuredDataFaqs faqs={[
    { question: "GitHub Actionsのビルド&デプロイに時間がかかってしまいます。解決方法はありますか？", answer: "GitHub Actionsのビルド&デプロイに時間がかかってしまう要因として、以下が考えられます。" }
]} />

GitHub Actionsのビルド&デプロイに時間がかかってしまう要因として、以下が考えられます。

- [GitHub ActionsのCPU性能とI/O性能](#github-actionsのcpu性能とio性能が影響している場合)
- [generateのinterval設定](#generateのinterval設定が影響している場合)
- [APIリクエスト数](#apiリクエスト数が影響している場合)
- [APIリクエストのレスポンス速度](#apiリクエストのレスポンス速度が影響している場合)
- [Artifactsのファイルサイズ](#artifactsのファイルサイズが影響している場合)

## GitHub ActionsのCPU性能とI/O性能が影響している場合
GitHub ActionsのCPU性能とI/O性能に関しては、変更が難しいものになりますが、以下のような制限があります。

:::info
[GitHub Docs -> GitHub Actions -> Workflow billing & limits -> 使用制限](https://docs.github.com/ja/actions/learn-github-actions/usage-limits-billing-and-administration#usage-limits)
:::

:::info
[GitHub Docs -> GitHub Actions -> 自分のランナーをホストする -> Usage limits](https://docs.github.com/ja/actions/hosting-your-own-runners/about-self-hosted-runners#usage-limits)
:::

## generateのinterval設定が影響している場合
Nuxt.jsの場合、nuxt.config.jsのgenerateプロパティでintervalを設定している場合は、intervalの値によってはgenerateの時間が増加します。

:::info
[Nuxt generate プロパティ](https://nuxtjs.org/ja/docs/configuration-glossary/configuration-generate#interval)
:::

## APIリクエスト数が影響している場合
SSGの場合、generateで各ページを生成する度にAPIリクエストを行うため、1ページを生成する際のAPIリクエスト数が多いと、生成するページが増える度にAPIリクエスト数が増えてしまい、generateの時間にも影響が発生します。  
以下のページで、SSGでgenerateする際にAPIリクエスト数を減少させるサンプルを紹介しておりますので、ご参照ください。

:::info
[Nuxt.jsのSSGで、ページの生成時にAPIリクエストを減らす方法はありますか？](https://kuroco.app/ja/docs/faq/can-i-use-nuxt-js-ssg-to-reduce-api-calls/)
:::

## APIリクエストのレスポンス速度が影響している場合
APIのレスポンス速度が遅い要因として以下が考えられます。

- APIのキャッシュ設定が有効になっていない
- APIレスポンスのデータサイズが大きい

### APIのキャッシュ設定が有効になっていない
APIのエンドポイントにキャッシュを設定することでAPIを高速に配信できます。  
エンドポイントのキャッシュ設定については以下のページをご参照ください。

:::info
[エンドポイント 設定項目一覧](/ja/docs/reference/endpoint-settings/)
:::

### APIレスポンスのデータサイズが大きい
必要のない項目などはAPIの後処理のホワイトリスト設定などで項目を絞りましょう。  
また、例えば、Kurocoのコンテンツ定義でWYSIWYGエディタを使用している場合に、テキストを貼り付けた際、文字の装飾がインラインのスタイル属性に記述されてしまうことが原因でデータが大きくなってしまう場合があります。

例：テキストをコピー＆ペーストした際に文字の装飾が引き継がれてしまい、インラインのスタイル属性に記述される
![Image from Gyazo](https://t.gyazo.com/teams/diverta/5525bb8358afe6fbdaed3cf0ca850ab8.jpg)
Wordファイル、PDFファイル、外部サイト等からテキストをコピーすると、スタイルを引き継いでしまいます。一度、別のテキストエディタに貼り付けて文字の装飾を外す方法があります。もしくは、貼り付けのショートカットキーを以下の方法で行うと、文字の装飾を引き継がずにテキストを貼り付けることができます。

Windowsの場合  
`Shift + Control + V`

Macの場合  
`Shift + Command + V`

## Artifactsのファイルサイズが影響している場合
GitHub Actionsでgenerateが完了した際に生成されるArtifactsのファイルサイズが大きい場合、デプロイの時間が増加してしまいます。
以下にファイルサイズを削減する方法をご案内いたします。

### 静的なリソースファイルをKurocoFilesに移行する
KurocoFilesとは、管理画面から更新ができるファイルアップロード機能です。  
画像などの静的なリソースファイルをKurocoFilesに移行することで、ソースファイル全体のファイルサイズを削減できます。  
また、KurocoFilesにアップされているファイルはCDNキャッシュされているため、高速に配信されます。

### 参考 
- [KurocoFilesの利用方法について](/ja/docs/management/file-manager/)
- [画像の動的変換について](/ja/docs/reference/api-convert-image/)

### HTMLファイルのファイルサイズを減らす
構築しているサイトがSSGの場合、HTMLファイルのファイルサイズを減らすことでArtifactsのファイルサイズを削減できます。  
また、APIから配信されるデータにWYSIWYGエディタの内容が含まれる場合、テキストにインラインのスタイル属性が記述されている場合があります。そのスタイル属性もHTMLに含まれてしまうため、HTMLファイルのファイルサイズ増加の影響になってしまいます。

:::info
[APIのデータサイズが大きい](#apiのデータサイズが大きい)
:::

### SVG Spriteをファイル化して読み込む
アイコンの表示にSVG Spriteを利用しており、SVGのコードをHTMLのソースに記載している場合、ビルドした際に生成されるページの全てにSVGのコードが記載されてしまうため、ページのサイズが肥大化してしまいます。  
その場合は、SVG Spriteのコードを`svg-sprite.svg`として読み込むことでHTMLのファイルサイズを削減することが出来ます。  

### 例
```html
<svg>
    <use xlink:href="/assets/svg/sprite.svg#icon-hoge"></use>
</svg>
```

## ページの内容を非同期処理で表示する
構築しているサイトがSSGの場合、サイト全体のページ数が多いとビルドの際に生成されるファイルの量も増えてしまいます。

一覧系ページの2ページ目以降のページを静的に生成している場合、`axios`を利用し非同期処理にて2ページ目以降を表示することで生成するページ数を少なくできます。
