Scribd
Upload
12 views29 pages

React JS History and Future

React JS is a JavaScript library developed by Facebook for building user interfaces, focusing on reusable components and efficient updates via a virtual DOM. It was created in 2011, open-sourced in 2013, and has evolved with significant milestones like React Native and Hooks. The future of React includes advancements in concurrent rendering and server-side rendering, enhancing performance and user experience.

Uploaded by

Shwifty Kelvin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
12 views29 pages

React JS History and Future

React JS is a JavaScript library developed by Facebook for building user interfaces, focusing on reusable components and efficient updates via a virtual DOM. It was created in 2011, open-sourced in 2013, and has evolved with significant milestones like React Native and Hooks. The future of React includes advancements in concurrent rendering and server-side rendering, enhancing performance and user experience.

Uploaded by

Shwifty Kelvin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 29

React JS: History and

Future

"A JavaScript library for building user interfaces.


Developed and maintained by Facebook (Meta).
Focuses on creating reusable UI components.
Roboto Slab

Focuses on creating reusable UI components.


Employs a component-based architecture.
Uses a virtual DOM for efficient updates."
Introduction

Option A
Uses a virtual DOM for efficient updates."

"Born from challenges in maintaining Facebook's


newsfeed.
History of React JS

Initially called FaxJS, created by Jordan Walke in 2011.


Inspired by XHP, a PHP framework.
First deployed on Facebook's newsfeed in 2011.
Key Features and Benefits

Option A

First deployed on Facebook's newsfeed in 2011.


Open-sourced in May 2013."

"2013: React.js open-sourced.


The React Ecosystem

"2013: React.js open-sourced.


2014: React Conf – First React conference.
2015: React Native released.
Future Trends and
Roadmap

2015: React Native released.


2017: React Fiber architecture introduced.
2018: Hooks proposal.
Conclusion

2018: Hooks proposal.


2019: React Hooks released in v16.8.
2022: React 18 released with concurrent features."
React JS: A Journey
Through Time and
Innovation
Option A
2022: React 18 released with concurrent features."

"React creates an in-memory representation of the


DOM.
What is React JS?

Changes are made to the virtual DOM first.


React then calculates the most efficient way to update the
real DOM.
Leads to improved performance and faster rendering.
The Genesis: From FaxJS to
React
Option A

Leads to improved performance and faster rendering.


Minimizes direct manipulation of the real DOM."

"UI is broken down into reusable components.


Key Milestones

"UI is broken down into reusable components.


Each component manages its own state.
Components can be easily composed to create complex UIs.
Virtual DOM

Components can be easily composed to create complex UIs.


Promotes code reusability and maintainability.
Simplifies testing and debugging."
Component-Based
Architecture

Simplifies testing and debugging."

"A syntax extension to JavaScript.


Allows you to write HTML-like structures within JavaScript
JSX: JavaScript XML

Option A

Allows you to write HTML-like structures within JavaScript


code.
Makes component code more readable and maintainable.
Transpiled into standard JavaScript by tools like Babel.
React Native: Mobile
Development
Transpiled into standard JavaScript by tools like Babel.
Not required but highly recommended for React
development."

"Framework for building native mobile apps using


Popular Libraries and Tools

Option A

"Framework for building native mobile apps using


JavaScript and React.
Write once, deploy to both iOS and Android.
Uses native UI components for a native look and feel.
Server-Side Rendering
(SSR) with Next.js

Uses native UI components for a native look and feel.


Enables code sharing between web and mobile apps.
Offers excellent performance and a large community."
React 18 and Concurrent
Features

Offers excellent performance and a large community."

"Redux: State management library.


React Router: Navigation and routing.
Server Components

React Router: Navigation and routing.


Material-UI/Ant Design: UI component libraries.
Axios/Fetch API: Data fetching.
The Future of React Native

Option A
Axios/Fetch API: Data fetching.
Jest/Enzyme: Testing frameworks."

"Next.js is a framework for building React applications


Evolving Best Practices

"Next.js is a framework for building React applications


with SSR.
Improves SEO and initial page load time.
Provides features like automatic code splitting and routing.
React JS: A Bright Future
Ahead
Option A

Provides features like automatic code splitting and routing.


Simplifies building production-ready React applications.
Supports static site generation (SSG) as well."
Key Takeaways

Supports static site generation (SSG) as well."

"Concurrent Rendering: Allows React to interrupt,


pause, resume, or abandon rendering tasks.
Transitions: New API to mark certain state updates as non-
React Popularity

Transitions: New API to mark certain state updates as non-


urgent.
Automatic Batching: React batches multiple state updates
into a single render for better performance.
New Suspense features"
JavaScript Framework
Popularity (2024)

New Suspense features"

"Render React components on the server during the


build process.
React vs Other
Frameworks
Option A

Improve initial page load and SEO.


Allow direct access to backend resources without API
endpoints.
Components don't need to be shipped to the client.
Resources for Learning
More

Components don't need to be shipped to the client.


Simplify data fetching and reduce client-side JavaScript."

"Improved performance with Fabric architecture.


Thank You!

"Improved performance with Fabric architecture.


Enhanced debugging and tooling.
Closer integration with native platforms.

You might also like