PricingLoginStart free
Frontend Academy · Pelajaran

Turbo: Cache dan Pipeline Tugasan

Tentukan pipeline dalam turbo.json, konfigurasikan kebergantungan tugasan dengan dependsOn, dan dayakan cache jauh untuk berkongsi output cache merentas mesin.

Pelajaran 4 daripada 417 langkah

Turbo: Cache dan Pipeline Tugasan ialah pelajaran Frontend Academy percuma di CoddyKit. Ini ialah pelajaran 4 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Frontend Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Frontend Academy merangkumi sejumlah 4 pelajaran.

Ringkasan Turborepo

Turborepo (kini hanya Turbo) ialah pengatur binaan berprestasi tinggi untuk monorepo JavaScript. Ia menjalankan tugasan merentas pakej secara selari, menyimpan keluaran berdasarkan nilai cincangan, dan melangkau kerja apabila input tidak berubah.

Mengapa Penyimpanan Cache Penting

Dalam monorepo dengan 20 pakej, menjalankan 'test' pada setiap penghantaran adalah mahal. Jika hanya satu pakej berubah, Turbo menjalankan semula ujiannya dan memainkan semula keluaran cache untuk 19 pakej yang lain — menukarkan minit kepada saat.

Cara Pencincangan Berfungsi

Turbo menghasilkan nilai cincangan untuk: fail sumber (glob masukan), kebergantungan (package.json + fail kunci), pemboleh ubah persekitaran yang anda isytiharkan, dan konfigurasi tugasan itu sendiri. Nilai cincangan sama = kerja yang sama = cache sepadan.

turbo.json — Saluran Paip

Isytiharkan tugasan dan hubungannya dalam turbo.json.

// turbo.json
{
  "$schema": "https://turbo.build/schema.json",
  "tasks": {
    "build": {
      "dependsOn": ["^build"],
      "inputs": ["src/**", "package.json"],
      "outputs": ["dist/**", ".next/**"]
    },
    "test": {
      "dependsOn": ["^build"],
      "inputs": ["src/**", "test/**", "package.json"]
    },
    "lint": { "inputs": ["**/*.{ts,tsx,js,jsx}", ".eslintrc*"] },
    "dev": { "cache": false, "persistent": true }
  }
}

masukan dan keluaran

masukan: fail yang menyumbang kepada nilai cincangan. keluaran: fail yang patut disimpan dan dipulihkan oleh Turbo dalam cache. Tetapkan kedua-duanya dengan betul dan kadar padanan cache anda boleh meningkat kepada lebih 90%.

dependsOn

['^build']: bina kebergantungan dahulu. ['lint']: jalankan pemeriksaan kod sebelum tugasan ini dalam pakej yang sama. ['^build', 'lint']: gabungkan kedua-duanya.

cache: false dan persistent: true

Tugasan seperti dev tidak pernah disimpan dalam cache (interaktif dan berjalan lama) serta berterusan (Turbo memastikan tugasan itu terus hidup). Tetapkan kedua-duanya untuk pelayan pembangunan.

Menjalankan Tugasan

Gunakan CLI Turbo.

npx turbo run build
npx turbo run test lint
npx turbo run build --filter=web
npx turbo run build --filter=web... --concurrency=10

Lokasi Cache

Cache setempat secara lalai berada di node_modules/.cache/turbo. Setiap larian menghasilkan catatan + keluaran yang dirakam. Padanan cache mencetak: 'cache hit, replaying logs'.

Cache Jauh

Hantar cache ke stor jauh supaya CI dan rakan sepasukan boleh berkongsi padanan. Daftar secara percuma melalui turbo login (Vercel Remote Cache) atau hoskan sendiri.

npx turbo login
npx turbo link    # link to a Vercel remote cache

# In CI:
env:
  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
  TURBO_TEAM: yourteam

Cache Jauh Dihoskan Sendiri

Alternatif OSS: turborepo-remote-cache (Node), turbo-cache-server (Go). Gunakan pada infrastruktur anda dan tetapkan pemboleh ubah persekitaran TURBO_API.

Masukan Pemboleh Ubah Persekitaran

Isytiharkan pemboleh ubah persekitaran yang mempengaruhi keluaran — Turbo menganggapnya sebagai masukan, jadi perubahan padanya akan membatalkan cache.

// turbo.json
{
  "tasks": {
    "build": {
      "env": ["NODE_ENV", "VITE_API_URL"],
      "outputs": ["dist/**"]
    }
  },
  "globalEnv": ["GITHUB_SHA"]
}

Penapisan

Jalankan tugasan untuk pakej tertentu atau pakej yang terjejas oleh perubahan.

# Specific package and its dependencies:
turbo run build --filter=web...

# Packages that depend on shared/ui:
turbo run test --filter='...@repo/ui'

# Changed since main:
turbo run lint --filter='[origin/main]'

# Combine:
turbo run build --filter=web...[origin/main]

DRY_RUN dan Pemprofilan

--dry=json mencetak graf tugasan tanpa menjalankannya. --profile menjana jejak bergaya Chrome-DevTools.

turbo run build --dry=json | jq
turbo run build --profile=trace.json
# open chrome://tracing and load trace.json

Perangkap Biasa

1) Terlupa mengisytiharkan keluaran (Turbo tidak akan menyimpannya dalam cache). 2) Terlupa pemboleh ubah persekitaran yang mempengaruhi binaan. 3) Menyimpan pelayan pembangunan dalam cache (tetapkan cache: false). 4) Tidak menggunakan --frozen-lockfile dalam CI (perubahan pada fail kunci boleh mengubah nilai cincangan).

Semakan Pantas

Apakah dua medan dalam konfigurasi tugasan Turbo yang menentukan sama ada keluaran boleh dimainkan semula daripada cache?

Jawab dalam pelajaran interaktif

Ringkasan: Turbo

Cache setempat + jauh berasaskan nilai cincangan untuk tugasan monorepo. turbo.json mengisytiharkan tugasan dengan dependsOn, masukan, keluaran dan persekitaran. cache: false + persistent: true untuk pelayan pembangunan. Tapis tugasan dengan --filter=web..., changed-since=[origin/main]. Cache jauh (Vercel atau dihoskan sendiri) berkongsi padanan merentas CI dan pasukan. Buat pemprofilan dengan --profile. Tetapkan masukan/keluaran dengan betul untuk kadar padanan maksimum.

Percuma untuk bermula

Pelajari HTML dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus
41
Pelajaran
163
Mula belajar secara percumaLihat kursus penuh

Soalan Lazim

Adakah pelajaran “Turbo: Cache dan Pipeline Tugasan” percuma?

Ya — teks penuh “Turbo: Cache dan Pipeline Tugasan” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus Frontend Academy, tingkat taraf kepada CoddyKit PRO. Kursus Frontend Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Turbo: Cache dan Pipeline Tugasan”?

Tentukan pipeline dalam turbo.json, konfigurasikan kebergantungan tugasan dengan dependsOn, dan dayakan cache jauh untuk berkongsi output cache merentas mesin. Anda berlatih Frontend Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Frontend Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Frontend Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 4 daripada 4.

Berapa lamakah pelajaran “Turbo: Cache dan Pipeline Tugasan” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Frontend Academy ini?

Ya. Setiap pelajaran Frontend Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

  1. Vite: Sistem Pemalam dan Mod SSR
  2. esbuild: Kelajuan dan Had
  3. Workspace pnpm untuk Monorepo
  4. Turbo: Cache dan Pipeline Tugasan
← Kembali ke Frontend Academy