වෙබ් අඩවි වලට මතකය දෙන්න: HTML5 Client-Side Storage හි බලය සහ ප්‍රතිලාභ! 🚀

අන්තර්ජාලය භාවිතා කරන ඔබ කවදා හෝ සිතා තිබෙනවාද, ඔබ නිතර පිවිසෙන වෙබ් අඩවියක් ඔබගේ මනාපයන් (preferences) මතක තබා ගන්නේ කෙසේද කියා? නැතහොත්, අන්තර්ජාල සම්බන්ධතාවය නොමැතිව වුවද සමහර වෙබ් අඩවි වලට පිවිසිය හැකි බව ඔබ දන්නවාද? 🤩 මේ සියල්ලටම හේතුව වන්නේ "Client-Side Storage" නම් වූ තාක්ෂණයයි. අද අපි මේ නවීන වෙබ් තාක්ෂණයේ වැදගත් අංගයක් වන Client-Side Storage පිළිබඳව Online Thaksalawa සමඟින් ගැඹුරින් සාකච්ඡා කරමු.

Client-Side Storage යනු කුමක්ද?

සාමාන්‍යයෙන්, ඔබ වෙබ් අඩවියකට පිවිසෙන විට, එම වෙබ් අඩවියට අවශ්‍ය දත්ත (උදා: ඔබගේ පරිශීලක නාමය, මුරපදය, ඔබගේ සාප්පු කරත්තයේ ඇති භාණ්ඩ) සේවාදායකයක් (server) මත ගබඩා කර ඇත. නමුත් Client-Side Storage යනු, මෙම දත්ත පරිශීලකයාගේ වෙබ් බ්‍රව්සරය (web browser) තුළම ගබඩා කිරීමේ ක්‍රමවේදයකි. 💡 මෙයින් සිදුවන්නේ, සෑම විටම දත්ත ලබා ගැනීම සඳහා සේවාදායකයක් හා සම්බන්ධ වීමට අවශ්‍ය නොවීමයි. මෙය වෙබ් අඩවි වල ක්‍රියාකාරිත්වය වේගවත් කරන අතර, පරිශීලක අත්දැකීම (user experience) බෙහෙවින් වැඩි දියුණු කරයි.

HTML5 හඳුන්වා දීමත් සමඟ, වෙබ් සංවර්ධකයින්ට තම වෙබ් අඩවි වලට දත්ත ගබඩා කිරීමේ හැකියාවන් රැසක් ලැබුණි. මෙහිදී ප්‍රධාන වශයෙන් ක්‍රම දෙකක් භාවිතා වේ: localStorage සහ sessionStorage. තවද, විශාල දත්ත ප්‍රමාණයක් ගබඩා කිරීම සඳහා IndexedDB වැනි වඩාත් දියුණු ක්‍රමවේදයන් ද පවතී.

ප්‍රධාන Client-Side Storage වර්ග:

1. localStorage: ස්ථිර මතකය 🚀

localStorage යනු වෙබ් අඩවියක් විසින් පරිශීලකයාගේ බ්‍රව්සරය තුළ දත්ත ස්ථිරව ගබඩා කිරීමට භාවිතා කරන ක්‍රමයකි. ඔබ බ්‍රව්සරය වසා දැමුවද, පරිගණකය ක්‍රියා විරහිත කළද, මෙම දත්ත නැවත ඔබ එම වෙබ් අඩවියට පිවිසෙන විට ලබා ගත හැක. මෙය කුකීස් (Cookies) වලට වඩා වැඩි දත්ත ප්‍රමාණයක් (සාමාන්‍යයෙන් 5MB සිට 10MB දක්වා) ගබඩා කිරීමට ඉඩ සලසයි.

උදාහරණ:

• ඔබගේ මනාපයන් (උදා: අඳුරු තේමාව - Dark Mode, භාෂාව).
• ඔබගේ සාප්පු කරත්තයේ ඇති භාණ්ඩ.
• ඔබ අවසන් වරට කියවූ ලිපියේ පිහිටීම.
• පරිශීලකයාගේ පිවිසුම් තොරතුරු (login status) - නමුත් ආරක්ෂාව පිළිබඳව සැලකිලිමත් විය යුතුය.

localStorage මඟින් වෙබ් අඩවි වලට පරිශීලකයාට විශේෂිත වූ අත්දැකීම් ලබා දීමට හැකියාව ලැබේ.

2. sessionStorage: තාවකාලික මතකය 💡

sessionStorage ද localStorage හා සමාන ආකාරයට දත්ත ගබඩා කළද, එහි ප්‍රධාන වෙනස වන්නේ දත්ත ගබඩා වන්නේ වත්මන් බ්‍රව්සර් සැසිය (current browser session) සඳහා පමණක් වීමයි. ඔබ බ්‍රව්සර් ටැබ් එක (tab) වසා දැමූ විට හෝ බ්‍රව්සරය වසා දැමූ විට, එම දත්ත ස්වයංක්‍රීයව මකා දමයි. මෙය තාවකාලික දත්ත ගබඩා කිරීම සඳහා ඉතා ප්‍රයෝජනවත් වේ.

උදාහරණ:

• ඔබ බහු-පියවර ආකෘති පත්‍රයක් (multi-step form) පුරවන විට, එක් පියවරක සිට තවත් පියවරකට යන විට දත්ත රඳවා තබා ගැනීම.
• තාවකාලිකව දර්ශනය වන පණිවිඩ (notifications).
• සැසියක් තුළ පමණක් අවශ්‍ය වන පරිශීලක මනාපයන්.

sessionStorage මඟින් පරිශීලකයාට බාධාවකින් තොරව වෙබ් අඩවියක් තුළ සැරිසැරීමට උපකාරී වේ.

3. IndexedDB: විශාල දත්ත සඳහා 💎

localStorage සහ sessionStorage සරල දත්ත (key-value pairs) ගබඩා කිරීමට සුදුසු වුවද, විශාල, සංකීර්ණ සහ ව්‍යුහගත දත්ත ගබඩා කිරීම සඳහා IndexedDB භාවිතා වේ. මෙය වෙබ් බ්‍රව්සරය තුළ ක්‍රියාත්මක වන දත්ත සමුදායක් (database) ලෙස සැලකිය හැකිය. IndexedDB මඟින් වෙබ් අඩවි වලට අන්තර්ජාල සම්බන්ධතාවය නොමැතිව වුවද ක්‍රියා කළ හැකි (offline-first) යෙදුම් නිර්මාණය කිරීමට හැකියාව ලැබේ. Online Thaksalawa හරහා මෙවැනි දියුණු සංකල්ප තවදුරටත් ඉගෙන ගත හැක.

උදාහරණ:

• අන්තර්ජාල සම්බන්ධතාවය නොමැතිව ක්‍රියා කරන ඊමේල් යෙදුම්.
• විශාල දත්ත සමුදායන් සමඟ ක්‍රියා කරන සංකීර්ණ වෙබ් යෙදුම්.
• ක්‍රීඩා වල දත්ත ගබඩා කිරීම.

Client-Side Storage හි වැදගත්කම සහ ප්‍රතිලාභ:

• වේගවත් ක්‍රියාකාරිත්වය: දත්ත සේවාදායකයෙන් ලබා ගැනීමට අවශ්‍ය නොවන නිසා වෙබ් අඩවි වේගයෙන් load වේ. 🚀
• වැඩිදියුණු කළ පරිශීලක අත්දැකීම: පරිශීලක මනාපයන් මතක තබා ගැනීමෙන් පුද්ගලාරෝපිත (personalized) අත්දැකීම් ලබා දිය හැක.
• අන්තර්ජාල සම්බන්ධතාවය නොමැතිව ක්‍රියාකාරිත්වය (Offline Capabilities): IndexedDB වැනි තාක්ෂණික ක්‍රම මඟින් අන්තර්ජාල සම්බන්ධතාවය නොමැතිව වුවද වෙබ් අඩවි වලට ක්‍රියා කළ හැක.
• සේවාදායකයේ බර අඩු කිරීම: සෑම විටම දත්ත සේවාදායකයෙන් ලබා ගැනීමට අවශ්‍ය නොවන නිසා සේවාදායකයේ බර අඩු වේ.
• පරිශීලකයාගේ පෞද්ගලිකත්වය: දත්ත පරිශීලකයාගේ බ්‍රව්සරය තුළම ගබඩා වන බැවින්, සේවාදායකය වෙත යවන දත්ත ප්‍රමාණය අඩු වේ.

ආරක්ෂාව පිළිබඳ සටහන: 🛡️

Client-Side Storage හි දත්ත පරිශීලකයාගේ බ්‍රව්සරය තුළ ගබඩා වන බැවින්, සංවේදී දත්ත (උදා: මුරපද, ක්‍රෙඩිට් කාඩ් තොරතුරු) ගබඩා කිරීමේදී ඉතා ප්‍රවේශම් විය යුතුය. මෙම දත්ත, වෙබ් අඩවියට ප්‍රවේශ විය හැකි JavaScript කේතයක් මගින් පහසුවෙන් කියවීමට හෝ වෙනස් කිරීමට හැකි බැවින්, කිසිවිටෙකත් පුද්ගලිකව හඳුනාගත හැකි තොරතුරු (Personally Identifiable Information - PII) හෝ ඉහළ සංවේදී දත්ත මෙහි ගබඩා නොකළ යුතුය. එවැනි දත්ත සේවාදායකය මත ආරක්ෂිතව සංකේතනය කර (encrypted) ගබඩා කිරීම වඩාත් සුදුසුය. වෙබ් සංවර්ධකයින් සෑම විටම දත්ත ආරක්ෂාවට ප්‍රමුඛත්වය දිය යුතුය.

අනාගතය දෙසට... 🌍

Client-Side Storage යනු නවීන වෙබ් සංවර්ධනයේ අත්‍යවශ්‍ය අංගයකි. එය වෙබ් අඩවි වලට "මතකයක්" ලබා දෙන අතර, පරිශීලකයන්ට වඩාත් කාර්යක්ෂම, පුද්ගලාරෝපිත සහ බාධාවකින් තොර අත්දැකීමක් ලබා දීමට උපකාරී වේ. වෙබ් තාක්ෂණය දිනෙන් දින දියුණු වන මේ යුගයේ, Client-Side Storage වැනි සංකල්ප තේරුම් ගැනීම ඔබට අනාගත වෙබ් යෙදුම් පිළිබඳව මනා අවබෝධයක් ලබා දෙනු ඇත.

මෙම ලිපිය ඔබට ප්‍රයෝජනවත් නම්, බෙදා ගැනීමට අමතක කරන්න එපා! 🚀

වැඩිදුර අධ්‍යාපනික ලිපි සඳහා අපගේ Online Thaksalawa බ්ලොග් අඩවියට පිවිසෙන්න.