Cara Setting Plugin Autoptimize

Cara Setting Plugin Autoptimize untuk meningkatkan kecepatan pada blog WordPress. Autoptimize adalah plugin optimasi WordPress gratis untuk optimasi file HTML, CSS, dan JavaScript.

Dalam posting ini, saya akan berbagi Cara Setting Plugin Autoptimize terbaik untuk meningkatkan kinerja dan kecepatan halaman situs WordPress Anda.

Kenapa Memilih Autoptimize?

Sebelum kita membahas ke Cara Setting Plugin Autoptimize terbaik, mari kita simak alasan kenapa pentingnya meningkatkan kecepatan blog WordPress dengan menggunakan plugin ini.

  • Versi gratis dari Autoptimize memiliki fitur lengkap untuk mengoptimalkan situs WordPress Anda.
  • Autoptimize adalah plugin optimasi dan tidak melakukan caching halaman HTML yang berarti itu kompatibel dengan semua hosting
  • Autoptimize sudah lebih dari 1.000.000 pengguna aktif di WordPress dan secara konsisten diperbarui dengan fitur baru dan perbaikan bug.

Cara Setting Plugin Autoptimize

HTML, CSS, dan JavaScript musuh dari plugin optimasi. Seperti plugin lainnya, Autoptimize dapat melakukan itu dengan baik, setting Autoptimize ini untuk meningkatkan kinerja blog Anda.

1. JavaScript Options Autoptimize

Optimize JavaScript Code

Ketika “optimize JavaScript code” diaktifkan, Autoptimize akan mengecilkan file JavaScript pada blog Anda.

Aggregate JS Files

Opsi “Aggregate JS Files” dari autoptimize akan menggabungkan semua file JavaScript Anda ke dalam satu file. Dimana menggabungkan JS dan CSS file adalah langkah kunci dalam optimasi WordPress. Jadi saya sarankan untuk mencoba kecepatan halaman Anda dengan opsi ini diaktifkan dan dinonaktifkan.

Also Aggregate Inline JS

Opsi “Also Aggregate Inline JS” mengekstrak inline JS di HTML Anda, dan menggabungkannya dengan file JS Autoptimize yang sudah dioptimalkan. Tetapi opsi ini bisa menyebabkan peningkatan yang cukup besar dalam ukuran cache di Autoptimize, saya sarankan agar opsi ini tetap dinonaktifkan.

Force JavaScript in

Opsi ini memaksa file JavaScript untuk dimuat di elemen <head> HTML situs Anda, Memaksa JS untuk memuatkan lebih awal dapat menghasilkan elemen pemblokiran render yang dapat memperlambat kecepatan halaman Anda.

Exclude Scripts from Autoptimize

Opsi ini untuk mengecualikan file JavaScript dalam blog WordPress Anda.

Add Try-Catch Wrapping

Opsi ini berguna untuk debugging masalah yang disebabkan oleh minification JS dan agregasi.

2. CSS Options Autoptimize

Optimize CSS Code

Sebaiknya Aktifkan opsi ini. Ketika “Optimize CSS Code” diaktifkan, Autoptimize akan mengecilkan file CSS Anda.

Aggregate CSS Files

Opsi “Aggregate CSS Files” dari autoptimize akan menggabungkan semua file CSS Anda ke dalam satu file. Seperti yang telah disebutkan sebelumnya. Saya merekomendasikan pengujian A/B opsi ini di situs Anda untuk menentukan apakah ada efek pada kecepatan halaman

Also Aggregate Inline CSS

Opsi ini akan memindahkan CSS inline ke file CSS Autoptimize. Sementara inline CSS ke file CSS browser-cacheable dapat mengurangi ukuran halaman, saya sarankan opsi ini untuk dinonaktifkan.

Generate Data: URIs for Images

Bila pilihan ini diaktifkan, Autoptimize akan base64-encode gambar latar belakang kecil dan menanamkan ke dalam CSS.

Inline and Defer CSS

Inlining critical CSS penting dapat mendorong kecepatan yang signifikan untuk beberapa blog. Dalam prakteknya, CSS inline biasanya menargetkan elemen seperti elemen struktural, global font families, dan navigasi.

Inline all CSS

Sama halnya yang diatas opsi ini untuk menginline semua CSS yang ada.

Exclude CSS from Autoptimize

Bagian ini untuk mengecualikan CSS dan diisi dengan :

  • wp-content/cache/
  • wp-content/uploads/
  • admin-bar.min.css
  • dashicons.min.css

3. HTML Options

Pengoptimalan HTML autoptimize dapat membantu mengurangi ukuran halaman Anda dengan menghapus spasi.

Optimize HTML Code

Sebaiknya Aktifkan fitur kode “Optimize HTML Code” karena mengurangi ukuran halaman dengan menghapus spasi yang tidak perlu di HTML Anda.

4. CDN Options

Pada bagian ini jika Anda menggunakan CDN premium seperti BunnyCDN, MaxCDN dan lainnya bisa memasukan URL pada bagian ini.

5. Misc Options

Save Aggregated Scripts/CSS as Static Files

Sebaiknya Aktifkan opsi ini untuk menyimpan file Aggregated sebagai file statis. Anda mungkin perlu menonaktifkan ini jika server Anda tidak dikonfigurasi untuk menangani kompresi file.

Minify Excluded CSS and JS Files

Sebaiknya Aktifkan opsi ini untuk memastikan semua file CSS dan JS minified. Namun, jika Anda melihat beberapa masalah yang berhubungan dengan minified dengan beberapa file CSS dan JS yang dikecualikan, Anda dapat menonaktifkan opsi ini.

Also Optimize for Logged In Editors/Administrators

Sebaiknya Aktifkan ini untuk memastikan aset dioptimalkan untuk editor dan administrator yang login. Hal ini penting jika Anda menguji pengaturan Autoptimize sebagai pengguna yang masuk.

6. Image optimization

Lazy-load images

Lazy-load ini berfungsi untuk membuat bagian gambar di akhir terakhir setelah semua text selesai di load yang berguna untuk memaksimalkan kecepatan pada blog.

Baca juga : Cara Memasang Lazy Load Google AdSense

Lazy-load Exclusions

Pada opsi ini jika Anda ingin gambar yang ingin memuat langsung di tampil, masukan nama gambar tersebut pada bagian ini.

7. Extra Plugin Autoptimize

Google Font

Opsi ini untuk Google Font pilih Combine and link in head agar font Google lebih cepat saat blog terbuka.

Remove Emojis

Opsi ini berfungsi agar menghapus semua emoji pada blog untuk tetap mempertahankan performa.

Remove Query Strings

Opsi ini berfungsi untuk memperbaiki dan meningkatkan skor GTMetrix.

Preconnect to 3rd Party Domains

Disini masukan URL dikolom Preconnect untuk pihak ketiga yang Anda gunakan di dalam blog Anda.

Ini adalah URL pihak ke tiga yang sering digunakan :

  • https://fonts.googleapis.com
  • https://fonts.gstatic.com
  • https://www.google-analytics.com
  • https://www.googletagmanager.com

Kesimpulan

Banyak plugin cache yang beredar sekarang dan tentunya ada juga yang gratis sampai yang berbayar, dengan tutorial ini semoga dapat membantu meningkatkan kecepatan pada blog Anda.

2 thoughts on “Cara Setting Plugin Autoptimize”

Leave a Comment