Pelajari kenapa JavaScript Promise nggak bisa dibatalkan secara native dan cara kerja AbortController untuk handle operasi async yang perlu di-cancel.

Promise di JavaScript itu seperti pesanan GoFood yang udah masuk ke dapur. Sekali chef mulai masak, kamu nggak bisa langsung bilang "cancel aja deh" dan expect dapet duit balik. Prosesnya tetep jalan di background.

Ini masalah klasik yang sering bikin developer pusing. Kamu panggil API, user tiba-tiba pindah halaman, tapi request-nya tetep jalan. Hasilnya? Memory leak, network yang mubazir, dan bug aneh yang susah di-trace.

Kenapa begini? Karena Promise itu designed untuk guarantee satu nilai: either resolve atau reject. Nggak ada state "eh ternyata gajadi". Spec-nya memang gitu, dan changing itu bakal break banyak kode yang udah ada.

Advertisement

Advertisement

Slot in-article yang tampil setelah paragraf ketiga.

Tapi tenang, ada solusinya. Modern JavaScript punya AbortController, API yang sebenernya buat cancel fetch request. Caranya? Kamu pass signal ke fetch(), terus panggil controller.abort() kapan aja.

Contoh praktisnya gini. Kamu bikin controller baru, taruh signal-nya di option fetch. Kalau user pencet tombol cancel atau pindah komponen, tinggal panggil abort(). Fetch-nya bakal throw error yang bisa kamu catch.

Yang menarik, AbortController ini versatile. Bukan cuma buat fetch, tapi bisa dipakai di event listener, Web Streams, bahkan some third-party libraries. Pattern-nya sama: bikin controller, pass signal, abort kalau perlu.

Tapi ada catatan penting. AbortController itu cancel the operation, bukan cancel the Promise. Promise-nya tetep ada, tapi jadi rejected dengan error "AbortError". Kamu tetep harus handle error-nya properly.

Untuk case yang lebih kompleks, ada pattern race-and-cancel. Kamu bisa kombinasiin Promise.race() dengan timeout atau abort signal. Jadi kalau operasi terlalu lama, otomatis di-cancel.

Library modern kayak Axios juga udah support cancellation. Mereka implementasiin mirip AbortController tapi dengan API yang lebih clean. Worth considering kalau project kamu udah pake Axios.

Takeaway praktisnya: selalu siapin cancellation mechanism untuk operasi async yang long-running atau user-triggered. Pake AbortController untuk fetch native, atau library yang support cancellation. Jangan biarin request nganggur tanpa kontrol.

AI Updates lagi bergerak cepat, jadi jangan cuma lihat headline.

Hacker News Front Page

Catatan redaksi

Kalau lo cuma ambil satu hal dari artikel ini

AI Updates update dari Hacker News Front Page.

Sumber asli

Artikel ini merupakan rewrite editorial dari laporan Hacker News Front Page.

Baca artikel asli di Hacker News Front Page
#AIUpdates#HackerNewsFrontPage#rss