Saya harus menyampaikan bahwa widget random post itu sangat jelek dalam hal performa. Kerja mereka sangat lambat dan membuang-buang tenaga, alasannya mereka bekerja dengan cara memanggil feed posting berukuran sangat besar! Kemudian mereka hanya akan menampilkannya sebagian saja secara acak:
<script src='/feeds/posts/default?alt=json-in-script&max-results=99999&callback=randomPosts'></script>Bagi Anda para pemakai mungkin tidak pernah tahu mengenai ini, tetapi sesungguhnya setiap pemakai widget random post —termasuk juga widget artikel terkait— tanpa sadar telah mendapatkan beban begitu besar. Ketika Anda membuka halaman tunggal dimana terdapat widget random post di dalamnya, pada dikala yang bersamaan Anda juga sesungguhnya sedang membuka semua posting yang telah Anda terbitkan dalam satu waktu. Mengapa? Karena parameter max-results pada feed menunjukkan angka 99999 yang artinya bahwa semua feed posting akan “diusahakan” untuk dipanggil (diusahakan, alasannya jumlah posting yang kita terbitkan mustahil mencapai angka sebesar itu).
Mengacak Indeks Permulaan
Saya menyadari terdapat sebuah peluang untuk membuat widget random post yang lebih ringan dan cepat dimuat. Dibandingkan memuat semua posting dan memilah beberapa posting secara acak untuk ditampilkan, akan lebih baik jikalau kita mengacak nilai start-index pada feed sehingga kita sanggup memuat posting dari urutan sembarang:
function randomPosts(json) { // Ubah JSON menjadi HTML... } var startIndex = Math.round(Math.random() * 9999); // Membuat angka acak document.write('<scr' + 'ipt src="/feeds/posts/summary?alt=json-in-script&start-index=' + startIndex + '&max-results=7&callback=randomPosts"></scr' + 'ipt>');Ada satu persoalan kecil yang mungkin akan mengganggu. Jika angka acak yang tercipta nilainya lebih besar dari total posting blog Anda dikala ini, maka widget random post ini tidak akan bekerja. Oleh alasannya itu kita harus membatasi angka acak yang tercipta, yaitu dilarang kurang dari 1 dan dilarang lebih dari “total posting dikurangi jumlah posting yang ingin ditampilkan”.
Untuk mendapatkan jumlah posting secara keseluruhan kita sanggup mengambilnya melalui objek json.feed.openSearch$totalResults.$t:
// Konfigurasi var homePage = 'http://nama_blog.blogspot.com', maxResults = 7; // Fungsi untuk menggenerasikan angka acak dengan batasan minimal dan maksimal function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } // Mendapatkan indeks pemulai yang kondusif untuk memanggil feed utama function createRandomPostsStartIndex(json) { // Buat angka acak dengan nilai dilarang kurang dari `1` dan dilarang lebih dari `total posting - posting yang ingin ditampilkan` var startIndex = getRandomInt(1, (json.feed.openSearch$totalResults.$t - maxResults)); // Tampilkan pesan log console.log('Get the post feed start from ' + startIndex + ' until ' + (startIndex + maxResults)); } document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&max-results=0&callback=createRandomPostsStartIndex"></scr' + 'ipt>');Muat ulang widget Anda berkali-kali. Seharusnya Anda akan melihat pesan log indeks pemanggilan posting yang berubah-ubah menyerupai ini:
Kita akan memakai angka acak itu sebagai angka pemulai pada parameter start-index menyerupai ini:
function createRandomPostsStartIndex(json) { var startIndex = getRandomInt(1, (json.feed.openSearch$totalResults.$t - maxResults)); document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&orderby=updated&start-index=' + startIndex + '&max-results=' + maxResults + '&callback=randomPosts"></scr' + 'ipt>'); }Pada bab simpulan URL feed terdapat parameter callback=randomPosts. randomPosts di sini merupakan fungsi utama yang akan kita buat untuk mengubah JSON Blogger menjadi widget:
function randomPosts(json) { var link, ct = document.getElementById('random-post-container'), entry = json.feed.entry, skeleton = "<ul>"; for (var i = 0, len = entry.length; i < len; i++) { for (var j = 0, jen = entry[i].link.length; j < jen; j++) { if (entry[i].link[j].rel == "alternate") { link = entry[i].link[j].href; } } skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>'; } ct.innerHTML = skeleton + '</ul>'; }Sentuhan akhir, acak urutan posting yang ditampilkan memakai fungsi ini sehingga daftar posting yang ditampilkan nantinya akan semakin acak urutannya:
// Fungsi untuk mengacak array function shuffleArray(arr) { var i = arr.length, j, temp; if (i === 0) return false; while (--i) { j = Math.floor(Math.random() * (i + 1)); temp = arr[i]; arr[i] = arr[j]; arr[j] = temp; } return arr; } // Widget function randomPosts(json) { var link, ct = document.getElementById('random-post-container'), entry = shuffleArray(json.feed.entry), skeleton = "<ul>"; for (var i = 0, len = entry.length; i < len; i++) { for (var j = 0, jen = entry[i].link.length; j < jen; j++) { if (entry[i].link[j].rel == "alternate") { link = entry[i].link[j].href; } } skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>'; } ct.innerHTML = skeleton + '</ul>'; }Hasil Akhir
<div id='random-post-container'>Memuat...</div> <script> //<![CDATA[ // Feed configuration var homePage = 'http://nama_blog.blogspot.com', maxResults = 7, containerId = 'random-post-container'; // Function to generate random number limited from `min` to `max` // Used to create a valid and safe random feed `start-index` function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } // Function to shuffle arrays // Used to randomize order of the generated JSON feed function shuffleArray(arr) { var i = arr.length, j, temp; if (i === 0) return false; while (--i) { j = Math.floor(Math.random() * (i + 1)); temp = arr[i]; arr[i] = arr[j]; arr[j] = temp; } return arr; } // Get a random start index function createRandomPostsStartIndex(json) { var startIndex = getRandomInt(1, (json.feed.openSearch$totalResults.$t - maxResults)); // console.log('Get the post feed start from ' + startIndex + ' until ' + (startIndex + maxResults)); document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&orderby=updated&start-index=' + startIndex + '&max-results=' + maxResults + '&callback=randomPosts"></scr' + 'ipt>'); } // Widget's main function function randomPosts(json) { var link, ct = document.getElementById(containerId), entry = shuffleArray(json.feed.entry), skeleton = "<ul>"; for (var i = 0, len = entry.length; i < len; i++) { for (var j = 0, jen = entry[i].link.length; j < jen; j++) { if (entry[i].link[j].rel == "alternate") { link = entry[i].link[j].href; } } skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>'; } ct.innerHTML = skeleton + '</ul>'; } document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&max-results=0&callback=createRandomPostsStartIndex"></scr' + 'ipt>'); //]]> </script>Ketika Posting Acak Dikirim Secara Langsung oleh Server
Dalam sebuah forum Saya pernah menemukan seseorang yang mencoba menyarankan Blogger untuk menyertakakan parameter orderby gres berupa random dan popular. Saya pikir ini yakni wangsit yang bagus. Karena menurut dokumentasi, kalau tidak salah hanya ada dua macam nilai untuk parameter orderby, yaitu published dan updated:
http://nama_blog.blogspot.com/feeds/posts/summary?orderby=published http://nama_blog.blogspot.com/feeds/posts/summary?orderby=updated
Jika suatu dikala Blogger merealisasikan masukan dari pengguna ini, maka kita tidak perlu lagi menerapkan hack semacam ini. Cukup dengan membuat widget recent post biasa, kita sanggup mengubah parameter URL feed dari orderby=published menjadi orderby=random untuk membuat widget random post atau orderby=popular untuk membuat widget posting populer. Tapi perkara ini masih dalam tahap “seandainya”.