Anda mungkin menetapkan belanjawan untuk beberapa metrik yang berbeza: Sebagai contoh, berat halaman sasaran 500 kilobytes, yang tidak ada halaman dalam projek anda. Unsur -unsur yang akan ditambah ke halaman untuk melebihi 500KB perlu dinilai terhadap unsur -unsur lain di halaman untuk menentukan kemasukan mereka dalam reka bentuk. Seperti yang diterangkan oleh Tim Kadlec, keputusan anda mesti mengambil salah satu daripada 3 laluan:
Mengoptimumkan ciri atau aset sedia ada pada halaman
Sebaik sahaja anda telah menetapkan belanjawan anda walaupun, ia adalah satu tugas tambahan untuk mengukur prestasi tapak anda sepanjang fasa pembangunan. Bagaimanakah anda dapat mencapai ini tanpa menambah ujian manual yang membebankan ke proses QA anda? Masukkan grunt.js!
grunt.js webpagetest.org = ujian ujian prestasi automatik
memperoleh kunci API
Jika ini adalah kali pertama anda menggunakan Grunt, lihat tutorial saya untuk bangun dan berjalan dengan Grunt.
Jika anda sudah memasang pemasangan pada komputer anda, anda hanya perlu memasang plugin perfbudget sebelum kami menyediakan ujian prestasi kami. Navigasi ke folder projek anda melalui baris arahan dan jalankan:
npm install grunt-perfbudget --save-dev
atau jika anda ingin projek sampel untuk bekerja dengan, garpu repositori github saya, grunt-perfbudget-demo dan jalankan pemasangan NPM untuk pergi.
Sebaik sahaja anda memasang plugin, anda perlu menyediakan pilihan plugin anda dan membuat tugas dalam gruntfile.js anda. Saya telah mencipta Demo Gruntfile yang menjalankan tugas perfbudget sebagai sebahagian daripada perintah grunt lalai, dengan hanya pilihan minimum untuk bermula - URL untuk menguji dan kunci API anda:
module<span>.exports = function(grunt){
</span> <span>require("matchdep").filterDev("grunt-*").forEach(grunt.loadNpmTasks);
</span>
grunt<span>.initConfig({
</span> <span>pkg: grunt.file.readJSON('package.json'),
</span>
<span>perfbudget: {
</span> <span>default: {
</span> <span>options: {
</span> <span>url: 'http://cfarman.com',
</span> <span>key: 'APIKEY'
</span> <span>}
</span> <span>}
</span> <span>}
</span> <span>});
</span>
grunt<span>.registerTask('default', ['perfbudget']);
</span><span>};</span>Apabila saya menjalankan tugas grunt lalai dengan set kunci API saya, saya mendapat output berikut dalam konsol:
Untuk mendapatkan laman web saya untuk lulus dan tidak menyebabkan tugas mengerang gagal (oleh itu menghentikan mana -mana laman web yang dibina dalam persekitaran binaan automatik), saya mempunyai dua pilihan: Saya boleh mengedit belanjawan saya sehingga saya lulus (berguna untuk ujian, Tidak banyak untuk prestasi!) Atau saya boleh mengikuti peraturan anggaran prestasi saya: mengoptimumkan, mengeluarkan barangan atau berhenti menambah barangan sehingga saya lulus metrik lalai. Buat masa ini, mari kita bermain dengan tugas kami untuk melihat ujian lulus.
pilihan perfbudget dan metrik webpagetest
Pertama, saya akan menukar pilihan saya supaya laman web saya berhenti gagal dan laporan tugas yang mengerang saya di bawah anggaran. Ini memerlukan harta tambahan dalam tugas perfbudget saya yang dipanggil 'Bajet':
<span>perfbudget: {
</span> <span>default: {
</span> <span>options: {
</span> <span>url: 'http://cfarman.com',
</span> <span>key: 'APIKEY',
</span> <span>budget: {
</span> <span>render: '3000',
</span> <span>SpeedIndex: '5500'
</span> <span>}
</span> <span>}
</span> <span>}
</span><span>}</span>Hasilnya? Saya lulus!
Ini bermakna tugas mengerang tidak gagal dan jika saya mempunyai tugas lain dalam gruntfile saya, mereka akan meneruskan seperti biasa - Kejayaan!
Selain metrik lalai, apa lagi yang boleh kita ukur? Semua jenis barangan, termasuk:
Metrik terakhir adalah yang paling saya laporkan dan ingin menjejaki tujuan belanjawan, jadi mari kita lihat bagaimana untuk mengukurnya:
npm install grunt-perfbudget --save-dev
Saya memilih bajet total sebanyak 2 juta, kerana berat halaman purata pada masa ini berlegar di bawah 2 megabait. Sebaik sahaja saya mengedit pilihan belanjawan, saya dapat melihat bagaimana saya lakukan dengan menjalankan tugas mengerang lagi:
kerana saya pengekodan - dan membantu saya meningkatkan prestasi sebagai hasilnya.
soalan yang sering ditanya mengenai pengujian prestasi mengautomasikan dengan grunt.jsBagaimana saya membuat gruntfile untuk projek saya? > Gruntfile adalah fail JavaScript yang masuk dalam direktori akar projek anda dan mengandungi konfigurasi untuk tugas -tugas yang mengerang. Ia dinamakan gruntfile.js atau gruntfile.coffee dan ditulis dalam JavaScript atau CoffeeScript. Untuk membuat floilfile, anda menentukan fungsi pembalut yang akan meluluskan contoh runtime dan di dalam fungsi ini, anda boleh memuatkan plugin grunt, mengkonfigurasi tugas, dan mendaftarkan tugas tersuai.
Bagaimana saya boleh menggunakan grunt.js untuk mengautomasikan ujian prestasi? Automatikkan ujian prestasi dengan grunt.js, anda boleh menggunakan plugin seperti grunt-contrib-uglify untuk minification, grunt-contrib-cssmin untuk minifikasi CSS, grunt-contrib-jshint untuk linting, dan grunt-contrib-qunit untuk ujian unit. Anda memasang plugin ini melalui npm, muatkannya di gruntfile anda dengan grunt.loadnpmtasks (), dan konfigurasikannya dengan menambahkan harta kepada kaedah grunt.initconfig (). Anda kemudian boleh menjalankan tugas dari baris arahan dengan grunt
Atas ialah kandungan terperinci Automatikkan Ujian Prestasi dengan Grunt.js. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
alat pembangunan php
Bagaimana untuk membuka php dalam halaman web
Apakah perbezaan antara protokol TCP dan protokol UDP?
Apakah itu HD mudah alih
Apakah sebab mengapa skrin komputer berwarna hitam tetapi komputer dihidupkan?
Penyelesaian untuk but semula dan pilih peranti but yang betul
Apakah tahap penilaian bintang pengguna mudah alih?
win10 menyambung ke pencetak kongsi
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
