TechWire

What is ReactJS

මේ දවස්වල ජනප්‍රිය මාතෘකාවක් තමයි  ReactjJS කියලා කියන්නේ. කාලයක් තිස්සේ ඉහල user rating එකක් තිබුණු Angular, BackboneJS, KnockoutJS, EmberJS වගේ web framework වලට තරඟයක් දෙන්න පුළුවන් වුනු අලුත් technology එකක් විදියටත් ReactJS හඳුන්වන්න පුළුවන්.

මොකද්ද මේ React කියන්නේ?

React කියන්නේ Javascript based UI library එකක්. මේක අපි කව්රුත් දන්න Facebook සමාගමේ නිර්මාණයක්. React වල විශේෂ දෙයක් තමයි interactive, stateful සහ reusable component භාවිතා කිරීම. මේ නිසා development process එක speed වෙනවා වගේම, code manageability එක, code readability එක  ඉහල මට්ටමක පවත්වාගන්න පුළුවන් වෙනවා. මේ වෙනකොට Facebook , Khan Academy, Sberbank සහ Instagram යන products සම්පුර්ණයෙන්ම වගේ නිර්මාණය කරලා තියෙන්නේ React වලින්.

 

 

ReactJS වල තියන ප්‍රධානම වගේම වැදගත්ම feature එක තමයි client side එකේ වගේම server side එකේදිත් render කරන්න පුළුවන් වීම. අනිත් වැදගත්ම දේ තමයි Virtual DOM concept එක.

මොකද්ද මේ Virtual DOM කියන්නේ?

Virtual DOM කියන්නේ Javascript Object එකක්.  Virtual DOM එකෙන් app performance එක වැඩි කරනවා, Virtual DOM එක regular DOM එකට වැඩිය performance improved නිසා.  regular DOM එක ගැන වැඩි විස්තර මෙතනින් බලන්න පුළුවන්. regular DOM එක dynamic UI වලට optimized නැහැ. අපිට Javascript වලින්, එහෙමත් නැත්තන් jQuery වගේ library එකක් use කරන්න පුළුවන්. ඒත් large scale apps වලදී elements වැඩි ප්‍රමාණයක් load කරන්න වෙනවා browser document එකට. උදාහරණයක් විදියට Facebook, Twitter, Pinterest වගේ services හඳුන්වන්න පුළුවන්. මේ වගේ වැඩකදී jQuery වල performance මදි වෙනවා.

මේ නිසා තමයි virtual DOM එකක requirement එකක් ආවේ.

React වලට app එකේ elements හඳුන්වන්නේ components විදියට. මේ components tree structure එකක් විදියට තමයි organize කරලා තියෙන්නේ.

React වලදී Virtual DOM දෙකක් භාවිතා කරනවා. එකක් හඳුන්වන්නේ original Virtual DOM එක විදියට. අනිත් එක updated virtual DOM එක. මේ DOM දෙක diffing algorithm එකකින් changes තියන subtrees වෙන වෙනම තෝරගෙන changes විතරක් Browser DOM එකට patch කරනවා. ඒ වගේම අඩුම changes count එකකින් component එක update කරගන්න විදියට තමයි Virtual DOM එක design කරලා තියෙන්නේ.

 

React වල features, advantages සහ limitations පහත විදියට දක්වන්න පුළුවන්.

React Features

  • React වලදී භාවිතා කරන්නේ JSX කියන javascript syntax extension එක. මේක අනිවාර්යය නොවුනත් Facebook එකෙන් recommend කරනවා JSX use කරන්න.
  • කලින් විස්තර කරපු විදියට React වලදී app එක design වෙන්නේ component based structure එකකට. ඒ කියන්නේ හැමදෙයක්ම component එකක් විදියට තමයි භාවිතා කරන්නේ. මේ component ඇතුලේ තවත් components තියෙන්න පුළුවන්.
  • One way data flow, එහෙමත් නැත්තන් unidirectional data flow කියන්නේ React වල තියන තවත් විශේෂ දෙයක්. මේකෙදි Flux කියන structure එක තමයි භාවිතා කරන්නේ.

React Advantages

  • මුලින්ම නම් කරන්න පුළුවන් කලිනුත් සඳහන් කරපු Virtual DOM එක. React වල performance improvement එකට ප්‍රධානම හේතුවක් වෙන්නේ මේක.
  • Client side එකේ වගේම server side එකෙත් render කිරීමේ හැකියාව
  • Components සහ Flux Architecture එකෙන් code readability එක improve කිරීම
  • Angular, Ember ඇතුළු අනිත් Frameworks වලටත් support කිරීම

React Limitations

  • View layer එක based library එකක් වීම
  • inline templating සහ JSX භාවිතය
  • learning curve එක සාපේක්ෂව වැඩි වීම
  • තරමක් heavy library එකක් වීම

ReactJS වගේ library එකකින් front-end performance වැඩි කරගන්න පුළුවන් වෙනවා වගේම well-grown community එකක් තියන නිසා ගොඩක් ලේසි වෙනවා ReactJS වලදී issues solve කරගන්න එක. ReactJS වලදී හඳුන්වා දුන්න Virtual DOM එකට web application development වල අලුත් වෙනසක් ඇති කරන්න පුළුවන් වෙලා තියනවා. ඒ වගේම තවත් වැදගත් දෙයක් තමයි React Native කියන්නේ. React Native වලින් mobile application develop කරන්න පුළුවන් Javascript use කරලා. මෙතැනදී develop වෙන්නේ HTML5 app එකක්වත් hybrid app එකක්වත් නෙමෙයි. අපිට ලැබෙන්නේ Native Language එකෙන් නිර්මාණය වුණු code එකක්. React Native වලදී ReactJS directly use නොවුනත් ඒ fundamentals තමයි භාවිතා වෙන්නේ.

 

                  

About author View all posts

Dhanushka Chandana

2 CommentsLeave a comment

Leave a Reply

Your email address will not be published. Required fields are marked *