Docker buildx build cache with Github actions

Next up on our list of docker related topics, build cache! Setting your GitHub actions builds up to build docker images is fairly straightforward. It gets a little tricky when you want to do and keep your build cache.

This trick will most likely save you hours of build time over the course of your project, maybe even more if you’re making regular deployments daily. For myself I went from a 4-min total build time to about 45 seconds of subsequent builds

Rather than breaking each piece down step by step, I will copy my entire workflow and comment each step that isn’t self-explanatory

# My action name is Build, and it triggers on commits to main, any newly created tags and any commits to a PR that targets main
name: Build
on:
  workflow_dispatch:
  push:
    branches:
      - 'main'
    tags:
      - '*'
  pull_request:
    branches:
      - 'main'

jobs:
  app:
    name: Build docs
    runs-on: ubuntu-latest
    steps:
      - name: Clone repository
        uses: actions/checkout@b4ffde65f46336ab88eb53be808477a3936bae11 # v4
      - name: Setup node
        uses: actions/setup-node@8f152de45cc393bb48ce5d89d36b731f54556e65 # v4
        with:
          node-version-file: '.nvmrc'
      # setup node was not working correctly for yarn.  I added my build cache manually with this step
      - name: Get node_modules cache
        uses: actions/cache@704facf57e6136b1bc63b828d79edcd491f0ee84 # v3.3.2
        id: node_modules
        with:
          path: |
            **/node_modules            
          key: ${{ runner.os }}-node_modules-${{ hashFiles('**/yarn.lock') }}
      # Qemu will allow is to target additional linux platforms with buildx
      - name: Set up QEMU
        uses: docker/setup-qemu-action@68827325e0b33c7199eb31dd4e31fbe9023e06e3 # v3
        with:
          platforms: linux/amd64,linux/arm64
       # Sets up a buildx instance using the platforms from our set-up Qemu step
      - name: Setup Buildx
        uses: docker/setup-buildx-action@f95db51fddba0c2d1ec667646a06c2ce06100226 # v3.0.0
        # Looks at our branch/commit to generate tags for our image.  Example being if this was triggered by a tag named v5.2, this step would create a tag for image eddiebeazer/docs:v5.2
      - name: Docker image meta
        id: image-meta
        uses: docker/metadata-action@e6428a5c4e294a61438ed7f43155db912025b6b3 # v5
        with:
          images: eddiebeazer/docs
       - name: Install dependencies
        run: yarn install --frozen-lockfile
      - name: Build app
        run: yarn build
        # builds and pushes our image.  The cache-to/from step is what will export our image layers to our GitHub cache for us to consume in a future build
      - name: Build and push image
        uses: docker/build-push-action@4a13e500e55cf31b7a5d59a38ab2040ab0f42f56 # v5
        with:
          context: .
          platforms: linux/amd64,linux/arm64
          push: true
          tags: ${{ steps.image-meta.outputs.tags }}
          labels: ${{ steps.image-meta.outputs.labels }}
          cache-from: type=gha
          cache-to: type=gha,mode=max