Abstract :
Nowadays, due to constant innovations in
technology, there are many available libraries to
help developers in the process of designing and
code visual and functional websites. Among all of
them, React is currently one of the most popular
in the developer community. When developers
work with React, there are three common
approaches used in the community. The purpose
of this project is to provide a comparison between
those approaches and an insight of how they
perform in a real world situation. For this task,
chrome developer tools was used for debugging.
The three different approaches (Classes,
functional and Hooks components) were tested
using 4 different projects. Each project had 3
different versions. One solely relies on state
management, the second one on an API response
and the third one an API call and the use of
Redux. After performing all tests, Hooks was the
clear winner overall but still there are developers
which use the other two approaches, classes
approach performed better than functional but it
can lead to misuse of class lifecycle which can
result in a performance downgrade, that is why
if possible, the use of functional when the manage
of state is not required is still recommended
instead of class based components for that work.
React is being updated regularly and further
improvement may be expected. Further studies
may be needed to cover new incoming features,
optimizations and improvements.
Keyword :
Hooks, javascript, programming, react, web