ขนาดชุดรวมและการเพิ่มประสิทธิภาพโค้ด
ลดขนาดชุดรวมของ Worker และการใช้งาน CPU เพื่อให้โค้ดที่เอดจ์โหลดได้เร็วขึ้นและทำงานภายในขีดจำกัด
ขนาดชุดรวมและการเพิ่มประสิทธิภาพโค้ด เป็นบทเรียน Edge Computing with Cloudflare Workers & Deno ฟรีบน CoddyKit นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Edge Computing with Cloudflare Workers & Deno และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Edge Computing with Cloudflare Workers & Deno มีบทเรียนทั้งหมด 4 บทเรียน
บางส่วนของบทเรียนนี้ยังไม่ได้รับการแปล และแสดงเป็นภาษาอังกฤษ
Why Bundle Size Matters
Workers have a script size limit (1 MB compressed on the free plan, more on paid).
Smaller bundles mean:
- Faster parse and startup
- Lower memory footprint
- Reduced cold-start impact
Optimizing your code is a direct performance win at the edge.
Measure Before Optimizing
Wrangler reports your bundle size on every build. Always measure first.
wrangler deploy --dry-run
# Total Upload: 142.18 KiB / gzip: 38.94 KiBTree Shaking
Use ES module import/export so the bundler can tree-shake unused code.
Import only what you need, never the whole library when a single function will do.
// Good: only pulls debounce
import debounce from 'lodash-es/debounce';
// Bad: pulls all of lodash
import _ from 'lodash';Prefer Lightweight Dependencies
Heavy npm packages bloat bundles fast. Prefer small, edge-friendly libraries.
- Use the platform
URL,crypto.subtle, andfetchinstead of polyfills - Swap moment.js for a tiny date helper
- Audit with a bundle analyzer
Use Web Standard APIs
Workers and Deno expose many Web Platform APIs natively, so you avoid bundling polyfills.
// Native crypto, no dependency needed
const hash = await crypto.subtle.digest(
'SHA-256',
new TextEncoder().encode('hello')
);Minification
Wrangler minifies production builds by default, but confirm it is enabled.
[build]
minify = trueReduce CPU Time
Workers bill and limit by CPU time, not wall-clock. Optimize hot paths:
- Avoid synchronous loops over huge arrays
- Cache computed results in KV or memory
- Stream large responses instead of buffering
Stream Instead of Buffer
Streaming sends data as it is produced, keeping memory low and CPU steady.
const { readable, writable } = new TransformStream();
response.body.pipeTo(writable);
return new Response(readable, response);Lazy-Load Rarely Used Code
Dynamic import() can defer loading code paths that are not always needed, keeping the initial module lean.
if (needsHeavyFeature) {
const { process } = await import('./heavy.js');
process();
}Analyze Your Bundle
Use an analyzer to see which dependencies dominate. esbuild (which Wrangler uses) can emit a metafile.
esbuild src/index.ts --bundle --metafile=meta.json
# upload meta.json to esbuild.github.io/analyzeBest Practices Summary
To keep edge code fast and small:
- Measure bundle size on every deploy
- Tree-shake and import narrowly
- Prefer native Web APIs over polyfills
- Minify, stream, and lazy-load
- Cut CPU time in hot paths
Quick Check
Which technique most directly lets the bundler remove unused library code?
Recap
You optimized both size and speed:
- Measure first, then tree-shake and minify
- Use native Web APIs and lightweight deps
- Stream and lazy-load to cut memory and CPU
- Analyze the bundle to find offenders
Lean Workers start faster and cost less, every kilobyte counts at the edge.
คำถามที่พบบ่อย
บทเรียน “ขนาดชุดรวมและการเพิ่มประสิทธิภาพโค้ด” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “ขนาดชุดรวมและการเพิ่มประสิทธิภาพโค้ด” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Edge Computing with Cloudflare Workers & Deno ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Edge Computing with Cloudflare Workers & Deno มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “ขนาดชุดรวมและการเพิ่มประสิทธิภาพโค้ด”
ลดขนาดชุดรวมของ Worker และการใช้งาน CPU เพื่อให้โค้ดที่เอดจ์โหลดได้เร็วขึ้นและทำงานภายในขีดจำกัด คุณปฏิบัติ Edge Computing with Cloudflare Workers & Deno ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Edge Computing with Cloudflare Workers & Deno หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน Edge Computing with Cloudflare Workers & Deno บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน
บทเรียน “ขนาดชุดรวมและการเพิ่มประสิทธิภาพโค้ด” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน Edge Computing with Cloudflare Workers & Deno นี้ได้ไหม
ได้ บทเรียน Edge Computing with Cloudflare Workers & Deno ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- กลยุทธ์การแคช
- การเริ่มต้นแบบเย็นและการเตรียมพร้อม
- การติดตามและการบันทึกข้อมูล
- ขนาดชุดรวมและการเพิ่มประสิทธิภาพโค้ด