Tuesday, July 15

Quran+: free iOs Apps

Al-Baqarah (2): 185 - (Beberapa hari yang ditentukan itu ialah) bulan Ramadhan, bulan yang di dalamnya diturunkan (permulaan) Al Quran sebagai petunjuk bagi manusia dan penjelasan-penjelasan mengenai petunjuk itu dan pembeda (antara yang hak dan yang bathil).

Bersempena Nuzul Quran, seorang hamba Allah telah membangun sebuah aplikasi untuk membaca quran. Interface yang menarik








Download sekarang kerana tawaran hanya terbuka untuk 2 hari sahaja. 


https://itunes.apple.com/my/app/quran+-read-quran-by-page/id884537056?mt=8

Aplikasi Laman Tunggal, Single Page Application

Ini adalah sebuah kalimat yang telah lama berlegar ketika seseorang itu merancang untuk membangun sebuah aplikasi mobil yang bersifat hybrid. Konsep ini rata-ratanya dipengaruhi oleh kecekapan Gmail, sebuah aplikasi email yang dibangun oleh Google. Bertitik tolak dari Gmail, Google mengembangkan konsep aplikasi laman tunggal ini kepada Google Docs, Drive, dan kini, Search. Anda tentu perasan dimana web-web tersebut begitu responsif terhadap setiap permintaan anda sewaktu anda klik pada pautan-pautan yang disediakan. Itulah kelebihan Konsep Aplikasi Laman Tunggal.

Tujuannya tak lain tak bukan adalah mempersembahkan sebuah aplikasi web yang menawarkan pengalaman penggunaannya hampir sama dengan penggunaan aplikasi desktop.

Teknik pembangunan yang digunakan juga amatlah berbeza sekiranya anda sudah terbiasa menyediakan berpuluh halaman untuk sesebuah web. Bagi pengaturcara PHP, anda sudah tentu terbiasa dengan teknik PHP yang dinamik, iaitu menyediakan satu template untuk header dan satu lagi untuk footer yang sifatnya umum bagi penggunaan yang meluas dalam projek web anda. Manakala bahagian dinamiknya adalah pada sidebar atau kandungan paparan utama. Kesimpulannya teknik ini memerlukan anda menjana kesemua template itu tadi di web server, dan membebankan server dan network untuk membawanya sebagai sebuah dokumen HTML kepada komputer client.

Ketika saya membangunkan sebuah aplikasi dashboard beberapa bulan yang lalu, saya berada dalam keadaan dilema ini. Waktu itu saya buntu kerana saya telah pun menghasilkan sebuah laman web yang perlu memaparkan beberapa carta, yang sepenuhnya diproses di server dan ia bersaiz agak besar kerana, terdapat berpuluh pustaka javascript dan CSS, serta data-data yang diperolehi daripada query pengkalan data. Tetapi carta-carta itu hanya akan terhasil ketika dokumen HTML itu lengkap muat sepenuhnya pada komputer client. Saya perlu paparkan sebuah carta yang interaktif. Interaktif beerti pengguna dapat berinteraksi dengan carta yang terpapar bagi memuaskan persoalan-persoalan analisisnya. Jadi disinilah dilema tersebut. 

Masalah ini saya atasi dengan penggunaan jQuery Ajax yang minimal pada mulanya. Tetapi lama kelamaan, ia jadi satu keperluan pula bagi menghasilkan sebuah aplikasi yang hanya ada sebuah halaman tetapi mempunyai berpuluh laman mini didalamnya.

Saya tertarik dengan konsep ini dan berjaya mengolah konsep ini menggunakan pustaka javascript iaitu BackboneJs. Pengalaman yang sudah hampir setahun telah banyak memberi kesan dalam memaknai kalimat tersebut. 

Ada yang pada saya baik untuk dipraktikkan konsep ini ketika mempertimbangkan keperluan-keperluan asas pengguna dan pada masa yang lain konsep ini perlu disederhanakan berikutan had-had atau halangan- halangan  tertentu terdapat pada kemampuan komputer client yang berbagai spesifikasinya.

Jikalau anda seorang yang mementingkan SEO Google, Yahoo dan Bing, konsep ini memerlukan anda untuk memfaktorkan semula kod-kod HTML, javascript dan CSS anda. Ini kerana, Search engine hanya berinteraksi dengan web server berbanding urusan yang terdapat dalam kod javascript anda. 

Apapun ini bukanlah sebuah konsep yang baru dalam dunia teknologi web. Mungkin saja ada yang telah mematangkan lagi konsep ini agar persembahan web tidak hambar di mata kasat pengguna smart phone. 

Thursday, July 10

Pemfaktoran kod yang Perlu diBeri Perhatian Bagi Kelancaran Aplikasi Backbone Anda

Setelah hampir setahun berkubang menggunakan BackboneJs dan RequireJs, berbagai faktor yang perlu diberi perhatian sekiranya anda benar-benar menitik beratkan untuk membangun sebuah aplikasi laman tunggal yang berkesan. Antaranya adalah 

1. Organisasi kod
2. Kebocoran memori pada Backbone.View dan Event
3. Kekerapan berhubung antara client dan server
4. Teknik rendering Backbone.model dalam sesebuah Backbone.Collection

Organisasi kod
Saya menggunakan RequireJs dalam soal organisasi kod. Ini adalah kerana pustaka ini berkhidmat untuk mengatur langsung keperluan-keperluan terhadap pustaka javascript yang lain bagi meminimalkan pencemaran penggunaan pembolehubah yang berskop global. Disamping itu kod yang terhasil adalah lebih mudah dibaca kerana kemodularan skop skrip itu sendiri. Apa yang menarik mengenai teknik ini adalah, aplikasi hanya akan memuat turun pustaka atau skrip yang diperlukan pada saat ia diperlukan. Jadi aplikasi tidak perlu untuk memuat turun keseluruhan kod atau skrip untuk sesebuah aplikasi berfungsi dengan berkesan.

Kebocoran memori pada Backbone.View dan Backbone.Event
Disebabkan ketergantungan BackboneJs kepada jQuery, maka adalah penting untuk anda memastikan setiap elemen yang dihasilkan oleh Backbone.View anda benar-benar dihapuskan dari view sebelum beralih kepada view yang lain. Ini kerana jQuery bertindak untuk meng'cache' atau mengklonkan elemen yang dihasilkan view bagi tujuan pengaksesan yang cepat. Maka kemungkinan besar anda akan terperangkap dengan tindakan jQuery tersebut dengan menghasilkan elemen-elemen yang serupa dengan fungsi yang sama. Ini adalah suatu kesalahan sekiranya anda tidak menyedari peranan tersebut. Anda akan dapati tindakan keatas elemen-elemen yang serupa dan sama itu tadi akan berakibat penghasilan pelaksanaan kod yang beberapa kali diulang-ulang. Backbone ada menyediakan ruang untuk atasi perkara ini, sama ada ada menggunakan kaedah .remove(), .off(), .setElement() atau .delegateEvent(). 

Kekerapan berhubung antara client dan server
Ada keadaan-keadaan tertentu yang memerlukan saya menghubungi server untuk query ke database bagi maklumat-maklumat tertentu. Sebagai contoh, maklumat pengguna yang login ke aplikasi. Maklumat ini pada awal pemulaan aplikasi, sewaktu pengguna sudah berjaya login, telah pun dicapai maklumatnya dari database. Jadi saya akan menentukan untuk menyimpan maklumat ini sama ada melalui kaedah in-memory, sessionStorage atau localStorage. Tetapi saya memilih untuk mengekalkannya sebagai sebagai sebuah objek yang aktif. Cara ini akan menjimatkan masa ulang alik query database kerana maklumat kritikal ini senantiasa diperlukan untuk operasi CRUD. Ini bermakna sebagai seorang pengaturcara, anda perlulah menilai kembali seberapa kerap anda perlu menjalin hubungan dengan server. 

Teknik rendering Backbone.model dalam sesebuah Backbone.Collection
Bagi sebuah Collection yang bersaiz besar, adalah penting untuk memfaktorkan semula teknik anda merender model didalamnya bagi mengelak penyalahgunaan memori pada komputer client. Sekiranya tidak difaktor semula, ini akan menimbulkan ketidakselesaan pada pengguna ketika menggunakan aplikasi. Kebanyakan contoh diluar akan menampilkan teknik jQuery .append() untuk render model dalam collection. Teknik ini akan mengurangkan tahap responsif sesebuah aplikasi terutamanya pada komputer lama. Salah satu cara yang popular untuk mengatasi masalah ini adalah document.createDocumentFragment(). Setakat ini saja cara yang cepat dan efisyen untuk merender subview.