Scribble Maps Blog
සංවර්ධකයින්: Autocomplete මඟින් Google API ක්‍රෙඩිට් ඉතිරි කර ගැනීම
Google හි නව API මිලකරණය සමඟ බොහෝ දෙනෙකුට වාසි සැලසී ඇත. කෙසේ වෙතත්, ඔබගේ යෙදුම සම්පූර්ණ සිතියම්කරණ ක්‍රියාකාරීත්ව කට්ටලයම භාවිතා කරන්නේ නම් සහ ඔබට විශාල පරිශීලකයින් සංඛ්‍යාවක් සිටී නම්, ඔබගේ ක්‍රෙඩිට් සංචිතය වේගයෙන් අඩු වීමට පටන් ගන්නා බව ඔබට පෙනෙනු ඇත. ඔබගේ ක්‍රෙඩිට් සංචිතයෙන් සෘජුවම ලබා ගන්නා සහ දෛනික නොමිලේ කෝටාවට යටත් නොවන ක්‍රියාකාරකම් දෙකක් වන්නේ autocomplete සහ place search ය.
ඔබ Scribble Maps API සමඟ ඔබේ Google බලපත්‍රය භාවිතා කරන්නේ නම්, අපි මෙම ප්‍රශස්තකරණයන් සමහරක් ස්වයංක්‍රීයවම සිදු කරන්නෙමු, නමුත් ඔබ Google Maps API මත සෘජුවම ඔබේම අභිරුචි ක්‍රියාත්මක කිරීමක් ගොඩනඟන්නේ නම්, ඔබට autocomplete ක්‍රෙඩිට් කිහිපයක් ඉතිරි කර ගැනීමට කළ හැකි සරල යාවත්කාලීන කිරීමක් තිබේ.
සම්මත auto-complete ක්‍රියාකාරීත්වය මඟින් ආදානයේ සිදුවන සෑම වෙනස්වීමකදීම auto-complete ඉල්ලීමක් යවනු ඇත. ආදානය වෙනස් වන විට timeout එකක් යෙදීමෙන් භාවිතා වන ක්‍රෙඩිට් ප්‍රමාණය සැලකිය යුතු ලෙස අඩු කළ හැකිය.
මෙන්න ඉතා මූලික උදාහරණයක්.
එබැවින් පරිශීලකයෙකු ආදානය ටයිප් කිරීමට පටන් ගන්නා සෑම අවස්ථාවකම සුළු ප්‍රමාදයක් සිදුවන තෙක් autocomplete ක්‍රියාත්මක නොවේ. Autocomplete නිතර ක්‍රියාත්මක කරවීම සඳහා 250ms ප්‍රමාදය අඩු කළ හැකිය. පරිශීලකයා ඉක්මනින් "Toronto" ලෙස ටයිප් කරන්නේ නම්, පරිශීලකයා මඳක් නතර වන විට 8 වතාවක් වෙනුවට එක් auto-complete ඇමතුමක් පමණක් ක්‍රියාත්මක වේ.
කාලය නියම කළ ප්‍රමාදය (timed delay) වඩාත් හොඳින් ක්‍රියා කරන බව අපට පෙනී යයි. මෙහිදී වැදගත් කරුණක් වන්නේ පරිශීලකයා ටයිප් කරන අතරතුර සෙවීමක් සිදුවෙමින් පවතින බව පරිශීලක අතුරුමුහුණත (user interface) මඟින් පෙන්නුම් කරන බව තහවුරු කර ගැනීමයි. අපගේ අවස්ථාවේදී අපි සජීවිකරණ ස්පිනරයක් (animated spinner) භාවිතා කරමු. මේ ආකාරයෙන් පරිශීලකයා ඉක්මනින් ටයිප් කර ප්‍රතිඵල නොදකින විට, සජීවිකරණ ස්පිනරය ඔවුන්ට ප්‍රතිඵල දැකීමට තරම් සුළු විරාමයක් ලබා දෙනු ඇත.
මෙය ක්‍රියාත්මක කිරීම ඔවුන්ගේ වත්මන් භාවිත කොන්දේසිවලට අනුකූල වන බව සඳහන් කළ යුතුය. මෙම ක්‍රමයෙන් මූලික වශයෙන් සිදු කරන්නේ පරිශීලකයාගෙන් පිටතට යන autocomplete ඇමතුම් ප්‍රමාණය පාලනය කිරීම (throttle) පමණි.
ඔබ Scribble Maps API සමඟ ඔබේ Google බලපත්‍රය භාවිතා කරන්නේ නම්, අපි මෙම ප්‍රශස්තකරණයන් සමහරක් ස්වයංක්‍රීයවම සිදු කරන්නෙමු, නමුත් ඔබ Google Maps API මත සෘජුවම ඔබේම අභිරුචි ක්‍රියාත්මක කිරීමක් ගොඩනඟන්නේ නම්, ඔබට autocomplete ක්‍රෙඩිට් කිහිපයක් ඉතිරි කර ගැනීමට කළ හැකි සරල යාවත්කාලීන කිරීමක් තිබේ.
සම්මත auto-complete ක්‍රියාකාරීත්වය මඟින් ආදානයේ සිදුවන සෑම වෙනස්වීමකදීම auto-complete ඉල්ලීමක් යවනු ඇත. ආදානය වෙනස් වන විට timeout එකක් යෙදීමෙන් භාවිතා වන ක්‍රෙඩිට් ප්‍රමාණය සැලකිය යුතු ලෙස අඩු කළ හැකිය.
මෙන්න ඉතා මූලික උදාහරණයක්.
var acTimeOut;
textSearchInput.onkeyup = function() {
clearTimeout(acTimeout);
acTimeout = setTimeout(function() {
//put auto-complete calls in here
}, 250);
}
එබැවින් පරිශීලකයෙකු ආදානය ටයිප් කිරීමට පටන් ගන්නා සෑම අවස්ථාවකම සුළු ප්‍රමාදයක් සිදුවන තෙක් autocomplete ක්‍රියාත්මක නොවේ. Autocomplete නිතර ක්‍රියාත්මක කරවීම සඳහා 250ms ප්‍රමාදය අඩු කළ හැකිය. පරිශීලකයා ඉක්මනින් "Toronto" ලෙස ටයිප් කරන්නේ නම්, පරිශීලකයා මඳක් නතර වන විට 8 වතාවක් වෙනුවට එක් auto-complete ඇමතුමක් පමණක් ක්‍රියාත්මක වේ.
කාලය නියම කළ ප්‍රමාදය (timed delay) වඩාත් හොඳින් ක්‍රියා කරන බව අපට පෙනී යයි. මෙහිදී වැදගත් කරුණක් වන්නේ පරිශීලකයා ටයිප් කරන අතරතුර සෙවීමක් සිදුවෙමින් පවතින බව පරිශීලක අතුරුමුහුණත (user interface) මඟින් පෙන්නුම් කරන බව තහවුරු කර ගැනීමයි. අපගේ අවස්ථාවේදී අපි සජීවිකරණ ස්පිනරයක් (animated spinner) භාවිතා කරමු. මේ ආකාරයෙන් පරිශීලකයා ඉක්මනින් ටයිප් කර ප්‍රතිඵල නොදකින විට, සජීවිකරණ ස්පිනරය ඔවුන්ට ප්‍රතිඵල දැකීමට තරම් සුළු විරාමයක් ලබා දෙනු ඇත.
මෙය ක්‍රියාත්මක කිරීම ඔවුන්ගේ වත්මන් භාවිත කොන්දේසිවලට අනුකූල වන බව සඳහන් කළ යුතුය. මෙම ක්‍රමයෙන් මූලික වශයෙන් සිදු කරන්නේ පරිශීලකයාගෙන් පිටතට යන autocomplete ඇමතුම් ප්‍රමාණය පාලනය කිරීම (throttle) පමණි.