Menguji Aplikasi Web Progresif Anda

  • 5 menit

Anda memiliki aplikasi web, dan telah diterbitkan ke Azure. Sekarang Anda dapat memastikan bahwa ia berfungsi sebagai Aplikasi Web Progresif.

Mengonfigurasi Aplikasi Web Progresif Anda

Biasanya, Vue CLI telah membuat file yang Anda butuhkan untuk Aplikasi Web Progresif Anda. Jika Anda melihat di folder/public/images/icons, Anda akan menemukan ikon siap pakai agar pengguna dapat membuat marka buku untuk aplikasi pada desktop. Proses build juga membuat file service-workers.js untuk meluncurkan pekerja layanan yang mengurus kemampuan offline. Pastikan pekerja layanan dapat dibuat dengan menambahkan satu file lagi ke aplikasi Anda: file vue.config.js.

Tambahkan file baru yang disebut vue.config.js ke akar aplikasi web Anda. File ini akan membantu file filter webpack yang menghentikan pekerja layanan untuk dibuat.

Di file ini, tambahkan kode berikut.

module.exports = {
    pwa: {
        workboxOptions: {
            exclude: [/\.map$/, /web\.config$/],
        },
    },
};

Sekarang, ketika Anda mendorong kode Anda ke GitHub dan ia dibangun, seharusnya pekerja layanan dibuat. Anda dapat menggunakan Alat Pengembang untuk menentukan Skor Lighthouse halaman Anda, yang merupakan cara yang baik untuk mengukur performa Aplikasi Web Progresif Anda.

lighthouse score.

Menguji aplikasi

Untuk menguji skor Lighthouse Anda, buka aplikasi web Anda di browser, lalu buka Alat Pengembang. Buka Audit dan buat laporan audit bagi aplikasi web Anda. Anda dapat menguji kemampuan offlinenya dengan memilih Aplikasi di area Alat Pengembang, lalu memilih Pekerja Layanan. Buat aplikasi Anda offline dengan memilih kotak centang offline, lalu coba aplikasi. Model seharusnya melakukan inferensi dengan baik, seolah-olah sedang online.

Cobalah untuk membangun model baru di Custom Vision AI dengan citra baru untuk pengujian dan verifikasi, lalu muat model Anda lagi melalui proses build Anda. Pekerja Layanan seharusnya menerima fakta bahwa ada model baru, dan mengingatkan Anda di konsol akan adanya model baru tersebut. Ketika Anda merefresh layar, model baru akan muncul.