Memilih Lokasi CDN jQuery Terbaik

Memilih Lokasi CDN jQuery - Artikel ini saya buat karena saya tidak bisa mengakses salah satu blog sahabat. Permasalahan yang timbul adalah lamanya proses pemanggilan code jQuery, sampai 5 menit saya tunggu tidak kunjung terbuka.

Dari permasalahan di atas, tentunya sobat harus pandai memilih lokasi penyimpanan jQuery. Ada beberapa CDN jQuery yang bisa sobat gunakan saat ini (ketika artikel ini dibuat, jQuery terbaru adalah versi 3.7.1), diantaranya :

1. Google (Sangat baik / stabil)

https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.js
https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js

2. Microsoft (Baik)

https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.7.1.js
https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.7.1.min.js

3. CloudFlare (Sedang)

https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.js
https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js

4. jQuery (Kurang)

https://code.jquery.com/jquery-latest.js
https://code.jquery.com/jquery-3.7.1.js
https://code.jquery.com/jquery-3.7.1.min.js

Dari ke 4 lokasi CDN tersebut, lokasi yang sering digunakan oleh sahabat adalah Google dan jQuery. Saya pribadi merekomendasikan untuk menggunakan Lokasi CDN Google, karena lebih stabil.

Ada sahabat yang menyatakan lebih baik menggunakan http://code.jquery.com/jquery.latest.js karena tidak usah update script dan otomatis update. Saya setuju dengan pendapat tersebut, namun saat ini jquery sering down, akhirnya blog tidak bisa dibuka. Bagi sahabat yang lebih suka menggunakan http://code.jquery.com/jquery.latest.js, saya sarankan membuat jQuery CDN Failover.

jQuery CDN Failover

CDN Failover adalah metode pengalihan lokasi framework jQuery dari satu host menuju ke host alternatif (cadangan). Metode failover sangat bermanfaat ketika host utama mengalami kendala akses baik itu karena limit bandwidth atau karena memang benar-benar mengalami masalah. Jika kita tidak menggunakan metode pengalihan (failover) ketika host utama mengalami kendala maka hal tersebut akan mempengaruhi kondisi situs yang kita kelola, apalagi jika situs tersebut menggunakan jQuery Ajax, jelas situs akan down total atau tidak bisa diakses. Hal ini sangat merugikan dan akan mempengaruhi kenyamanan pengunjung situs, ujung-ujungnya para pengunjung enggan kembali lagi untuk menulusuri situs. Mencegah hal tersebut maka kita perlu menyediakan cadangan framework agar masalah down host utama bisa teratasi. CDN Failover adalah cara terbaik untuk mengatasi masalah diatas.

CDN Failover Metode 1

Script dibawah ini merupakan yang metode failover yang paling sederhana. Script akan melakukan pemeriksaan ketersediaan framework, jika ternyata framework tidak berhasil di-load, maka lokasi framework dialihkan.

<script type="text/javascript" src="https://code.jquery.com/jquery.latest.js"></script>
<script type="text/javascript"> 
if (jQuery) {  
 // jika jQuery berhasil di-load maka fungsi disini akan dijalankan...
} else {
 // jika jQuery gagal di-load, maka framework akan dialihkan ke lokal...
 document.write('script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"><\/script>');
}
</script>

CDN Failover Metode 2

Metode ke-2 ini hampir mirip dengan metode ke-1, perbedaannya hanya pada statement pemeriksaan keadaan. Script hanya akan melakukan pengalihan jika keadaan halaman tidak mampu me-load framework, jika berhasil maka script tidak akan menjalankan perintah pengalihan lokasi framework.

<script type="text/javascript" src="https://code.jquery.com/jquery.latest.js"></script>
<script type="text/javascript"> 
if (typeof jQuery == 'undefined') {  
    // jika jQuery gagal di-load, maka framework akan dialihkan ke lokal...
 document.write('script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"><\/script>'); 
} else {
    // jika jQuery berhasil di-load maka fungsi disini akan dijalankan...
}
</script>

CDN Failover Metode 3

Metode ke-3 ini merupakan metode yang banyak digunakan oleh situs-situs jejaring sosial media dalam memanggil framework-nya. Metode ini sebenarnya merupakan pengembangan dari CDN Failover metode ke-2.

<script type="text/javascript" src="https://code.jquery.com/jquery.latest.js"></script>
<script type="text/javascript">  
 if (typeof jQuery === 'undefined') {  
    var e = document.createElement('script');  
    e.src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js';  
    e.type='text/javascript';  
    document.getElementsByTagName("head")[0].appendChild(e);  
 }
</script>

Semoga bermanfaat....

Berita Lebih Baru Berita Lebih Lama
  • Sunandar
    Profil: https://www.blogger.com/profile/17786224717024098823
    19 Juni, 2013

    wah thanks ya kang buat infonya :)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      sama2 sob...

  • Sinto
    Profil: https://www.blogger.com/profile/08235438206112119920
    19 Juni, 2013

    Hihih pernah liat dulu :D

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      =D

  • Unknown
    Profil: https://www.blogger.com/profile/10412067532083169212
    19 Juni, 2013

    gak ngerti jquery kang,,,ngikut aja :P

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      itu di templatenya ada.. :

      <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' type='text/javascript'></script>

  • Saeful Rahman
    Profil: https://www.blogger.com/profile/12948365880346888770
    19 Juni, 2013

    ternyata ngaruh juga ya lokasi penyimpanan JQuery. Pantesan aja blog saya terasa lola. Saya pakai versi ini, kira-kira JQuery ini diganti http://code.jquery.com/jquery.latest.js dengan JQuery lain, enaknya pake yang mana + cocok buat blog saya ?

    • Sinto
      Profil:https://www.blogger.com/profile/08235438206112119920
      19 Juni, 2013

      jquery latest artinya jquery yang terbaru, jadi saat jquery update Versi lagi maka otomatis script jquery.latest akan update kode juga, dan jquery versi baru tentunya kodenya lebih banyak makanya blog makin lambat,

      Kita hanya perlu memilih salah satu versi jquery aja mulai dari 1.3.2 sampe yang terbaru,

  • Anonim
    Profil:
    19 Juni, 2013

    Gak tau mas ... :D Belum paham juga saya , :)

    • Anonim
      Profil:
      20 Juni, 2013

      Aku buka blog yang ada code.jquery blablablabla kok gak bisa kebuka ya mas ... padahal buka blog saya dan yang lain lancar ... masalahnya dimananya yah mas kira2 ??

      Oiya maf mas sedikit OOT, mau tanya penjelasan dari padding dan margin pada CSS itu apa yah mas ?? atau kalau ada yang bisa kasi tau mohon dijawab ya ..

      Terimakasih .. :)

  • Kang Muroi
    Profil: https://www.blogger.com/profile/15022422809113377143
    19 Juni, 2013

    wah kalo saya tinggal pake nih kang :d
    tapi alhamdulillah nambah ilmu lagi kang...

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      semoga bermanfaat sob..

  • Anonim
    Profil:
    19 Juni, 2013

    googleapis memang terkenal paling kenceng kecepatan akses nya. Itu sebabnya lebih sering digunakan oleh website berdomain berbayar, bahkan forum & website social network yang sudah punya nama pun masih pakai CDN jquery Google ini.

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      betul sob... setujuuuuuuu.. google emang paling handal

  • Adhy Suryadi
    Profil: https://www.blogger.com/profile/06846144400647921085
    20 Juni, 2013

    Akhirnya dijelaskan juga...hehehe...makasih kang ilmunya...

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      hehehee... ngeri si akang ini kemana arah tulisan saya :)

  • zigzoor
    Profil: https://www.blogger.com/profile/10438425858295508916
    20 Juni, 2013

    nyimak, dan ternyata banyak juga yah, sayamah copy weh tinu sanes, hatur nuhun infona.

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      kumaha we carana mah kang... supados langkung faham

  • Imron Fhatoni
    Profil: https://www.blogger.com/profile/18030836574216391697
    20 Juni, 2013

    ikutan nyimak gan..

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      jangan disimak aja... difahami juga =D

  • Sopala Multapa
    Profil: https://www.blogger.com/profile/17709242066690693656
    20 Juni, 2013

    owh gitu toh kang siplah saya jadi lebih faham

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      ya.. begitulah kira2nya =D

  • Unknown
    Profil: https://www.blogger.com/profile/14829711507703692945
    20 Juni, 2013

    Wah begitu yah kang :) baru faham setelah baca bolak balik :D


    btw kalo jquery yang ini boleh nggak di ganti ? ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min,js

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      kalau mau diganti, tinggal versinya aja paling sob... tapi versi 2.0.2 blom suppor IE 6,7&8. kalau mau support kode itu aja, ga usah diganti

  • Stiker Jalingkut
    Profil: https://www.blogger.com/profile/11002288119582788560
    20 Juni, 2013

    trmksih bnyk akang infonya sangat bermanfaat jga bisa di cba,ni kang

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      sama2 sob.....

  • Unknown
    Profil: https://www.blogger.com/profile/16193528609734671554
    20 Juni, 2013

    saya nyimak saja ya, makasih kang ilmunya... :D

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      20 Juni, 2013

      sama2 sob.....

  • Anonim
    Profil:
    20 Juni, 2013

    kunjungan perdana kang, kebetulan template blog saya hampir mirip dengan blog kang ismet :D

  • Anonim
    Profil:
    21 Juni, 2013

    kalau server google emang tidak perlu diragukan lagi kang, dijamin top pokoknya. untuk nitip-nitip file mantap dah daya aksesnya...

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      21 Juni, 2013

      betul sob.. google emang top bgt :)

  • Unknown
    Profil: https://www.blogger.com/profile/17943695039070055752
    21 Juni, 2013

    kira" Lighbox evolution saya jalan ga ya kalau pake v2.0.2..
    soalnya waktu pake 1.8.3 ga jalan tuh...
    G@l@u

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      21 Juni, 2013

      sekarang pake versi brp sob? kalau menurut saya 2.0.2 blum banyak support... saya lebih enjoy 1.7.1 atau 1.8.3

  • cillasmartcorp
    Profil: https://www.blogger.com/profile/17927701776104884711
    21 Juni, 2013

    Nambah pengetahuan baru nih... bisanya hanya pake aja n nggak mau belajar lebih detail sabab musababnya hehehe... thanks pencerahannya kang...

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      21 Juni, 2013

      sekarang jadi tau kan sob :)

  • dedetea66
    Profil: https://www.blogger.com/profile/06523142341619489998
    21 Juni, 2013

    wah ini ilmu baru buat saya Kang,haturnuhun untuk info yang satu ini Kang

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      23 Juni, 2013

      sami2 kang dede...

  • Unknown
    Profil: https://www.blogger.com/profile/11343195555127101998
    23 Juni, 2013

    makasih info nya kang, kalau saya sendiri kebetulan pengguna jQuery bukan dari google...
    btw, saya ikutan follow ya kang, kalau bersedia di follback, hehehehe...|o|

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      23 Juni, 2013

      darimana saja juga bisa ko... asal pertimbangkan juga kestabilan server :)

Tambahkan Komentar
comment url
Terima kasih telah berkomentar di Blog Kang Ismet.
  • Untuk menyisipkan Gambar, Kode, atau Kutipan silahkan klik Tab Sisipkan di atas.
  • Emoji yang bisa digunakan pada komentar :), :D, :( <3, :love dan :top
  • Untuk melihat Komentar yang telah ditambah sisipan kunjungi DEMO
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Klik tombol Salin Kode! lalu paste ke kolom komentar.


image quote pre code
60 Komentar