Apa pekerja layanan dalam bereaksi js

93

Saat membuat aplikasi react, service worker dipanggil secara default. Mengapa pekerja layanan digunakan? Apa alasan permintaan default?

javascript reactjs service-worker usergs
sumber

Jawaban:

105

Anda mungkin tidak memerlukan pekerja layanan untuk aplikasi Anda. Jika Anda membuat proyek dengan create-react-app, itu dipanggil secara default

Pekerja layanan dijelaskan dengan baik di artikel ini . Untuk Meringkas dari itu

A service workeradalah skrip yang dijalankan browser Anda di latar belakang, terpisah dari halaman web, membuka pintu ke fitur yang tidak memerlukan halaman web atau interaksi pengguna. Saat ini, mereka sudah menyertakan fitur like push notificationsand background syncand have ability to intercept and handle network requests, termasuk programmatically managing a cache of responses.

Di masa depan, service worker mungkin mendukung hal-hal lain seperti periodic syncatau geofencing.

Menurut PR ini untuk membuat-bereaksi-aplikasi

Service workersdiperkenalkan dengan create-react-app melalui SWPrecacheWebpackPlugin.

Menggunakan pekerja server dengan strategi cache-first menawarkan keuntungan kinerja, karena jaringan tidak lagi menjadi penghambat untuk memenuhi permintaan navigasi. Ini berarti, bagaimanapun, bahwa pengembang (dan pengguna) hanya akan melihat pembaruan yang diterapkan pada kunjungan "N + 1" ke halaman, karena sumber daya yang di-cache sebelumnya diperbarui di latar belakang.

Panggilan ke register service workerdiaktifkan secara default di aplikasi baru tetapi Anda selalu dapat menghapusnya dan kemudian Anda kembali ke perilaku biasa.

Shubham Khatri
sumber
2
Adapun aplikasi reactjs yang sekarang dihasilkan memiliki kode sw tetapi komentar menyatakan bahwa fungsi register tidak dipanggil. Jadi pertanyaannya adalah di mana saya bisa menyebutnya?
Daneel Yaitskov
@ DaneelS.Yaitskov, Anda dapat menyebutnya di file index.js tingkat atas atau serupa.
Siddhartha
1
@Siddhartha, bisakah Anda berbaik hati memberikan contoh konkret, dan mungkin memperbarui jawabannya? Saya menemukan ini sangat berguna tetapi saya kehilangan detail terakhir itu. Terima kasih.
Ted Stresen-Reuter
17

Dengan kata sederhana dan sederhana, ini adalah skrip yang dijalankan browser di latar belakang dan tidak memiliki hubungan apa pun dengan halaman web atau DOM, dan menyediakan fitur di luar kotak. Ini juga membantu Anda menyimpan aset Anda dan file lainnya sehingga ketika pengguna sedang offline atau di jaringan yang lambat.

Beberapa dari fitur ini adalah permintaan jaringan proxy, pemberitahuan push, dan sinkronisasi latar belakang. Pekerja layanan memastikan bahwa pengguna memiliki pengalaman offline yang kaya.

Anda dapat menganggap pekerja layanan sebagai seseorang yang duduk di antara klien dan server dan semua permintaan yang dibuat ke server melewati pekerja layanan. Pada dasarnya, seorang perantara. Karena semua permintaan melewati pekerja layanan, ia mampu mencegat permintaan ini dengan cepat.

masukkan deskripsi gambar di sini

Nikz
sumber
6

Saya ingin menambahkan 2 pertimbangan penting tentang Service Worker untuk dipertimbangkan:

  1. Service Worker memerlukan HTTPS. Tetapi untuk mengaktifkan pengujian lokal, batasan ini tidak berlaku untuk localhost. Ini untuk alasan keamanan karena Service Worker bertindak seperti orang di tengah antara aplikasi web dan server.

  2. Dengan Create React App Service, Worker hanya diaktifkan di lingkungan produksi, misalnya saat dijalankan npm run build.

Service Worker siap membantu mengembangkan Aplikasi Web Progresif . Sumber yang bagus tentangnya dalam konteks Create React App dapat ditemukan di situs web mereka di sini .

Anouar
sumber