1. Halo Guest, pastikan Anda selalu menaati peraturan forum sebelum mengirimkan post atau thread baru.

Jutaan pengguna WP belum paham konsep pagespeed, ini masalahnya...

Discussion in 'Blog/CMS Stuff' started by trianoraga, Dec 30, 2019.

  1. trianoraga

    trianoraga Super Hero

    Joined:
    Jul 7, 2010
    Messages:
    1,465
    Likes Received:
    946
    Judulnya uda cukup clickbait belom? :bosan:

    Intinya ... trit ini spesifik buat pengguna wp self host.. kita ulas bareng masalah umum apa yg bikin WP loadnya lambat plus beberapa tips yang memungkinkan buat dishare.

    Yang penting paham bener masalahnya apa, biar ga salah cari solusi...

    Ok...yuk mulai.... Apa aja komponen WP yg berkaitan langsung sama pagespeed? :cerutu:

    1. HOSTING
    Sebelum cari cara optimasi speed yg pake istilah teknis yang bikin pusing, Hosting tetep jadi faktor utama pagespeed.

    Mau optimasi theme/plugin pake cara apapun, kalo Hosting ga bisa diajak ngebut = percuma.

    Tips : Cari perusahaan plus paket hosting yang sedia opsi trial... entah gratis bulan pertama, atau full refund selama skian hari...

    Selama masa trial ini, pake buat pasang theme+plugin yang kita butuhin, trus cek load timenya >> bandingin antara hosting yang satu dengan yang lain.

    Pas bandingin, pake theme dan plugin yang sama ya biar perbandingannya head to head.

    Kalo udah, baru masuk ke pertimbangan lain... downtimenya gimana, aturannya pembatasannya ribet/engga, CSnya ok ato engga, fasilitas tambahan apa dst...

    2. Script yang dipake (Theme dan Plugin global)

    Poin ini sy crita masalah globalnya aja ya..

    Jadi gini...WP kan opensource, siapa aja yang mampu bebas ngoprek.

    Yang jadi masalah.. tidak semua developer peduli soal speed.

    Eliminate render-blocking JavaScript and CSS in above-the-fold content

    Pernah dapet peringatan di atas kalo cek di pagespeed insight?

    Itu sebenernya kalo developer theme dan pluginnya mau, bisa kelar dengan nambah beberapa baris kode doang.

    Apakah menyalahi standar penulisan kode WP? Sama sekali engga.

    Kenapa ga banyak yang lakuin? Karna harus kluar dari zona nyaman programmer...

    Ngapain ngulik bikin script baru kalo yang lama aja masih jalan...mungkin gitu...

    Solusi buat yg awam? sama kaya hosting... bandingin antara theme/plugin satu dengan yang lain dengan fungsi yang sama.

    Pake jasa optimasi speed biar ga perlu ganti theme/plugin? Bisa aja sih... tapi biasanya ga budget friendly.

    Sy pernah nemu jasa optimasi WP tarifnya sampe ribuan dollar, dan bisa maklum...karna faktanya.. ngoprek script theme atau plugin yg udah jadi lebih ribet daripada bikin sendiri. (Salah satu conto optimasinya sy taruh di bagian akhir trit)

    Ada temen ngerti dan bisa bantuin? Good... baik2in dah :melet:

    3. Page builder
    Apapun judulnya... mau elementor, wp bakery dkk itu 100% pasti bikin lemot... luar dalem pula.
    Jadi ga cuma pengunjung yang loadnya lambat..kita waktu ngedit postingan juga.

    Knapa ya? :ninja:

    Jadi ibaratnya gini... page builder itu tukang sayur...Begitu kita aktifin page builder, smua dagangan tukang sayur ini diserahin ke kita.

    Mau bikin sayur sop yang cuma butuh beberapa bahan? Bodo amat! Nih Bawa smua!!! Gitu...

    Yang lebih 'nyenengin'... abis bikin sayur sop, kan kita sajiin nih ke pengunjung web... itu yg kita sodorin ga cuma sayurnya, tapi plus bahan2 yang ga kepake tadi.

    Jadi secara ga langsung kita ngomong ke pengunjung... "Ini sayur sop enak... silakan dinikmati... ini ada bahan makanan sisa bawa pulang skalian yaa...."

    Bisa ga pake page builder tapi pagespeed tetep bagus? BISA... syaratnya.. halaman yang pake pagebuilder harus dalam kondisi udah fix, ga mau diubah lagi.

    Kalo udah... publish page >> copy kode htmlnya >> buang yg bikin berat >> jadiin custom page >> DONE.

    4. Minify script (JS/CSS)

    Pernah ketemu istilah ini kan di plugin cache/speed?

    Minify script secara umum terbagi jadi 2 fungsi :

    1. Hapus spasi dan komentar dari file html, fungsi ini ga terlalu ngaruh banyak di pagespeed karna pagesize cuman berkurang beberapa KB... tapi buat web yg pengunjungnya ratusan ribu bisa manfaat buat hemat pmakean bandwith.

    Jangan percaya tulisan unmeter/unlimited bandwith di paket hosting ya...pasti ada embel2nya tu...

    Ada efek sampingnya? Ada. Di sisi lain, proses buat hapus spasi dan komen ini kan servernya pake mikir... otomatis yg naik cpu usagenya.

    Sila dicoba + cek via cpanel masing2.. kalo ga sampe bikin dapet kartu kuning dari CS Hosting ya brarti aman..

    2. Combine JS/CSS

    Nurut sy pribadi... ini solusi paling aneh buat 0ptimasi speed. Subyektif ya...

    Balik ke analogi sayur tadi ya...
    Konten web = sayur,
    CSS = seperangkat aturan gimana sayur mau disajiin, pake mangkuk/piring, warna apa , bentuk sendoknya gmn ...dsb
    JS = seperangkat aturan gimana interaksi antara pengunjung web dengan sayur yg udah tersaji... misal kalo pengunjung pegang sendok muncul tulisan "Selamat menikmati.." dsb

    Tiap theme/plugin kebanyakan naruh CSS dan JS ini di file kepisah... dan harus dipanggil dulu..

    Kalo cek web kita di pagespeed insight, jumlah brapa kali halaman web manggil file/data ada di bagian >> Pertahankan jumlah permintaan tetap rendah

    Makin banyak yang dipanggil = makin lambat web.

    Yang dilakuin plugin, kalo kita aktifin ini... Semua file CSS dan JS dari theme/plugin dijadiin 1 file CSS dan 1 file JS. Maksudnya biar skali manggil gitu..

    Alhasil emg bener jumlah manggilnya berkurang... tapi kan ukuran file yang dipanggil lebih gede.
    Udah gitu lokasi manggilnya tetep sama.. di header.

    Mmmm... gini2... yg make plugin autoptimize coba deh.. bedain aktifin fitur ini vs engga.

    Hasilnya bakalan sama tuh kluar peringatan Render Blocking.

    Belum lagi resiko script JS nya jadi ga jalan kalo digabung jadi 1.

    Solusinya? GA USA DIPAKE :komunis:

    Ada solusi yang lebih ok? Ada.. File CSSnya gausah dipanggil... taruh aja isi filenya di header (kalo CSS) dan di footer (kalo JS) .

    5. Cache

    Beberapa yg salah paham soal konsepnya, anggep asal aktifin fitur cache mendadak webnya jadi ngebut.

    Garis bawahnya, Cache bekerja di browser pengunjung...bukan di server kita.

    Ada 2 jenis Cache... Cache file statis(Image,CSS,JS) dan Page cache.

    Cache File Statis >> Ketika orang pertama kali berkunjung ke web kita, browsernya nanya tuh.. ini halaman isinya apa (Sayur), cara sajiinya gmn (CSS), aturan interaksinya gimana (JS). Trus smua file itu didownload browser dan disimpen sesuai aturan Cache yg kita set. Bisa seminggu/bulan/tahun.

    Page cache >> Ketika orang pertama kali berkunjung ke web kita, server kita kerja buat nyajiin hidangan. Loading halaman web = proses penyajian. Ambil sup dari panci, dituang ke mangkuk baru disodorin ke pengunjung. Page Cache ini mirip screenshot, jadi kalo pengunjung balik lagi ke halaman yang sama... udah ga ngulang Loading.

    Bisa bikin cepet web? Bisa..ketika orang berkunjung ulang ke halaman yang sama dan dia belum clear cache.

    Biar lebih jelas coba aktifin fitur cache >> cek di pagespeed insight >> kalo udah kluar hasilnya, cek ulang dengan selisih di bawah 3 menit >> hasil yang ke 2 pasti lebih cepet karna gugel masih nyimpen cache dari tes yg pertama.

    Masalahnya... Gugel kasih score page speed di Google Analytic berdasarkan tes pertama atau kedua? :malu:

    6. CDN

    CDN konsepnya mirip cache tapi file kita disimpen di server penyedia jasa CDN.

    Sederhananya gini... Pengunjung dateng >> server kita ngecek dia lokasi di mana >> server kita kasih perintah ke penyedia CDN : "itu ada orang dari zimbabwe mau nyobain sup.. sajiin dari servermu yang paling deket biar orangnya ga nunggu kelamaan.."

    Konsepnya bagus kan ya... ada tapinya... seberapa besar kita brani kasih kepercayaan ke penyedia CDN itu. Inget ga bbrp bulan lalu salah satu penyedia CDN tenar servernya down dan bikin web clientnya ga bisa diakses.

    Selain itu, penyedia CDN punya server yg lokasinya deket sama target market kita ngga... jangan2 pake CDN justru lebih lambat daripada langsung pake server kita sendiri.

    Di lain konteks, ini jadi jawaban kenapa AMP loadnya hampir ga ada lawan (kalo pengunjung dari gugel, bukan langsung kita akses urlnya)... karena halaman web yang dibuka sudah versi cache dan dikirim dari CDN punya gugel.

    PENUTUP : Optimasi speed bikin pengunjung lebih betah dan ningkatin konversi (penjualan, lead dsb)... udah banyak riset yang nyatain itu. Di sisi lain... jangan lupa kalo makin enteng web kita, biaya operasional kita juga makin dikit. Ga perlu sewa server kapasitas besar... kalo pake vps speknya ga perlu tinggi... murah.


    EXTRA :
    karna gan @romisuganda minta conto teknis dan sekaligus sdikit jawab pertanyaan gan @Diandra , trit sy tutup dengan 1 conto cara optimasi script bawaan WP.

    Pegang dulu konsepnya ya.. Tiap file JS/CSS pasti punya nama panggilan, asal kita tau nama panggilannya, bisa kita atur.

    Conto : Emoji Styles and Scripts, ini fasilitas bawaan WP buat ubah karakter jadi emoji... misal :) berubah jadi emoji senyum.

    File JSnya punya panggilan 'print_emoji_detection_script' , file CSSnya punya panggilan 'print_emoji_styles'.

    Kalo ga butuh dan mau hapus, bisa paste kode berikut di dalem file function.php :
    remove_action( 'wp_head','print_emoji_detection_script', 7 );
    remove_action( 'wp_print_styles', 'print_emoji_styles' );

    Keterangan : remove_action = kita kasih perintah ke WP buat ga manggil 2 file itu.

    Mau tetep pake WP emoji tanpa bikin lemot jg bisa, setelah edit function.php kita copy isi file CSS WP Emoji >> paste di header sebelum </head> plus copy isi file JS >> paste di footer sebelum </body>

    Moga2 ga bikin stres ya... sejak awal sebenernya uda hindarin ngomongin teknis, cuma pengen cerita konsep.

    Semoga bermanfaat dan selamat bekerja kembali :lovekiss:
     
    Last edited: Dec 31, 2019
    bungbroto, Pangky, bleza and 10 others like this.
  2. Abdip21

    Abdip21 Ads.id Fan

    Joined:
    May 25, 2018
    Messages:
    235
    Likes Received:
    69
    Location:
    malang
    Lanjut hu

    Sent from my meizu C9 using Tapatalk
     
    trianoraga likes this.
  3. romisuganda

    romisuganda Bukan Super Hero

    Joined:
    Feb 24, 2014
    Messages:
    1,098
    Likes Received:
    539
    Jejak dulu

    Request dong lebih teknis ke masalah dan solusi per kasus hehe
     
  4. Tian

    Tian Ads.id Pro

    Joined:
    Aug 13, 2016
    Messages:
    477
    Likes Received:
    93
    Wahh keren hu, lanjut dah.. Biar ane dapet ilmu baru.

    Sent from my Redmi 8A using Tapatalk
     
    trianoraga likes this.
  5. rinirina

    rinirina Aged Domains Seller

    Joined:
    Nov 17, 2014
    Messages:
    1,380
    Likes Received:
    142
    Location:
    Rivendale
    ane gak pake pake builder, speed masih jauh dari rasa puas :D
     
  6. linkIT

    linkIT Ads.id Pro

    Joined:
    Sep 23, 2013
    Messages:
    285
    Likes Received:
    28
    Location:
    Jakarta Timur
    Theme dr 2013 sampe skr msh setia pake Genesis.
    baybay builder [emoji41]
     
    trianoraga likes this.
  7. Ethan Hunt

    Ethan Hunt Ads.id Fan

    Joined:
    Aug 3, 2019
    Messages:
    152
    Likes Received:
    60
    Location:
    Internet
    pusing juga pakai yang mode builder, sejauh ini lebih suka pakai theme yang simpleĀ² saja, dan setuju dengan ts bahwasanya sudah di utak-atik apapun selama hostingnya memang tidak bisa cepat sama aja bo'ong :D
     
    trianoraga likes this.
  8. Diandra

    Diandra Super Hero

    Joined:
    Apr 8, 2011
    Messages:
    3,330
    Likes Received:
    2,168
    Location:
    Ads.id
    Kira2 kalo ngebersihin Head Section bagian-bagian ini [codecanyon.net/item/seo-cleaner-wordpress-plugin-for-site-clean-up/15791563]:
    • Remove WordPress Generator Version
    • Remove WLW Manifest Link
    • Remove RSD Link (EditURI Link)
    • Remove Shortlink
    • Remove Prev/Next Links
    • Remove Hardcoded Styles for Recent Comments
    • Remove Emoji Styles and Scripts
    • Remove DNS Prefetch Link
    • Remove wp-embed and jquery-migrate Scripts
    Seberapa pengaruh buat speed web kita ya? Ada yang pernah coba, trus SEO nya jadi jelek?
     
  9. trianoraga

    trianoraga Super Hero

    Joined:
    Jul 7, 2010
    Messages:
    1,465
    Likes Received:
    946
    Ga smua masalah yg sy critain bisa dishare solusinya tanpa bikin trit baru masGan...tar di bagian akhir trit coba sy kasi salah satu conto ya... biar jelas knapa hampir ga mungkin share solusinya di trit yg ini...

    Di semua web WP pribadi + client emg sy hapus bagian itu... karena kebetulan ga butuh.

    Dari sisi SEO stau sy ga ada plus maupun minusnya, karna gugel udah ngumumin mreka mengabaikan rel prev/next.

    Dari sisi speed, di WP versi baru ga terlalu ngaruh... karna cara load scriptnya udah lebih cakep.
     
  10. dodoo

    dodoo Super Hero

    Joined:
    May 9, 2010
    Messages:
    1,292
    Likes Received:
    104
    wah.. bener mastah..
    web wisata q tmpilan asoy tapi jadi super letoy, pengunjung turun... .. meski ada banyak kw nyantol di hal 1... wah.. balikin theme yg ringan aja yak wkwkwk.. saran dong bos theme ringan contohnya (yg premium) apa y.. yg ok juga dari segi lokasi penampilan ads nyaa.... makasih suhu penjelasannya..
     
  11. mandela83

    mandela83 Super Hero

    Joined:
    Oct 5, 2010
    Messages:
    1,666
    Likes Received:
    81
    Location:
    Bogor
    Sangat mencerahkan masgan...Lanjutkan hehehe!
     
  12. yulius lumban tobing

    yulius lumban tobing Hero

    Joined:
    Jan 27, 2017
    Messages:
    514
    Likes Received:
    95
    saya hilang client klass kakap karena webnya loadingnya lama banget. hadehhh ayok share ilmunya biar web wus wus

    Sent from my CPH1803 using Tapatalk
     
  13. AdhyKun

    AdhyKun Super Hero

    Joined:
    Jan 17, 2012
    Messages:
    872
    Likes Received:
    42
    Location:
    Bengkulu - Yogyakarta - Solo
    page2 builder itu, spt elementor/wp bakery dkk...

    Memang dr segi fitur banyak bisa pasang2 ini itu tinggal drag n drop...
    Perlu di ketahui untk membuar 1 row kosong aja ngeload div classnya bertingkat2 minta ampun... beban html css js membengkak bikin web lambat
     
    trianoraga likes this.
  14. yulius lumban tobing

    yulius lumban tobing Hero

    Joined:
    Jan 27, 2017
    Messages:
    514
    Likes Received:
    95
    divi builder sama aja kah om?

    Sent from my CPH1803 using Tapatalk
     
  15. newbie to master

    newbie to master Super Hero

    Joined:
    Feb 7, 2014
    Messages:
    1,135
    Likes Received:
    79
    Location:
    Yogyakarta
    Pesen ke agan bisa kagak themesnya hihi...
    mau dong... ud g pernah oprek soale
     
  16. Tian

    Tian Ads.id Pro

    Joined:
    Aug 13, 2016
    Messages:
    477
    Likes Received:
    93
    Bisa bikin themenya gan yg sesuai dengan trhead? Rame nih pasti kalau keluarin karyanya.

    Sent from my Redmi 8A using Tapatalk
     
  17. Ahmad Sarnuji

    Ahmad Sarnuji Super Hero

    Joined:
    May 30, 2015
    Messages:
    1,918
    Likes Received:
    201
    Location:
    Kab.Tangerang, Desa Sumur Bandung
    ehkeheem ahahah
     
  18. trianoraga

    trianoraga Super Hero

    Joined:
    Jul 7, 2010
    Messages:
    1,465
    Likes Received:
    946
    Kalo emg clientnya kakap napa ga pake jasa optimasi aja mas... kan sayang daripada lepas

    Ga punya divi dan belum pernah nyoba... cobain aja dulu... critain hasilnya ya...

    Udah pernah bikin + dishare gratis di sini... dan ga serame yg dibayangin masGan @Tian kok hehe.. itu di Reply masGan @AdhyKun ada link lapak..
     
  19. trianoraga

    trianoraga Super Hero

    Joined:
    Jul 7, 2010
    Messages:
    1,465
    Likes Received:
    946
    kalo theme rekomendasi sy ga bisa jawab masGan..beberapa taon trakir pake punya sendiri... mungkin member yg lain bisa bantu jawab..
     
  20. yulius lumban tobing

    yulius lumban tobing Hero

    Joined:
    Jan 27, 2017
    Messages:
    514
    Likes Received:
    95
    cari jasa temen2 d sn slow respon.. jadi kabur deh hehe... belum rejeki

    Sent from my CPH1803 using Tapatalk
     

Share This Page