Jocker ID - Kecepatan loading sebuah blog atau situs adalah modal utama agar bisa dipercaya oleh visitor. Kenyamanan visitor akan terjaga dengan speed load yang cepat pada halaman anda. Tips ini tak dikhususkan untuk sekawanan blogger saja, namun cara yang satu ini memang sudah menjadi rekomendasi Google terhadap para webmasternya.
Anda akan merasakan perbedaan yang signifikan dalam menilai blog yang terpasang tombol 'like' facebook dan tidak. Blog yang bebas dari tombol share tersebut akan lebih cepat dimuat oleh browser ketimbang dengan blog yang terdapat social plugin seperti like box dan teman-temannya. Tapi dalih seperti itu mungkin saja telah dipatahkan dengan hadirnya script Asynchronous yang telah disediakan oleh pengembangnya masing-masing.
 |
| Image: Google |
Bagaimana Cara Kerjanya? Sebagai blogger sebaiknya tahu ini, bila anda menggunakan script kode yang standart maka mereka akan dimuat secara bersamaan ketika browser membuka halaman. Hal ini yang mengakibatkan dan sering terjadi bahwa konten muncul setelah widget atau social box atau like button. Bila kita tidak memperbaikinya, saya pastikan bahwa visitor akan malas dan pergi karena harus menunggu loading yang begitu lama akibat script kode yang anda pasang lama dimuat.
Berbeda dengan script kode Asyncrhonous, mereka bekerja di belakang layar. Artinya mereka akan mendahulukan konten dimuat daripada script kode tersebut. Sehingga konten akan muncul lebih awal daripada social plugin seperti share button. Berikut adalah script kode Asynchronous yang saya dapatkan dari masing-masing pengembangnya.
Facebook SDK
Facebook Like
Referensi: Developers Google
<div id='fb-root'/> <script>window.fbAsyncInit=function(){FB.init({appId:"YOUR APP-ID",status:true,xfbml:true})};(function(){if(document.getElementById("facebook-jssdk")){return}var b=document.getElementsByTagName("script")[0];var a=document.createElement("script");a.id="facebook-jssdk";a.src="//connect.facebook.net/en_US/all.js";b.parentNode.insertBefore(a,b)}());</script>Twitter
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>Google Plus
<script type='text/javascript'> window.___gcfg = { lang: 'zh-CN', parsetags: 'onload' }; (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script>Sahabat silakan ganti kode-kode script share-nya dengan kode-kode di atas, untuk pemasangan kode ini biasa disimpin sebelum </body> dalam template. Sementara itu, untuk peng-aplikasiannya supaya tombol like, tweet, dan plus one muncul, berikut kode HTML nya.
Facebook Like
<div class='fb-like' data-layout='button_count' data-send='false' data-show-faces='false' data-width='90' expr:data-href='data:post.url'/>Tweet
<a class='twitter-share-button' data-count='horizontal' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>Plus One
<div class='g-plusone' data-count='true' data-size='medium' expr:data-href='data:post.url'/>Semoga ini bisa membantu blog anda yang sedang kerepotan karena loading blog yang membosankan. Selamat mencoba dan semoga bermanfaat.
Referensi: Developers Google
