WHAT IS THE DIFFERENCE BETWEEN REACT.JS AND REACT NATIVE?
Amit Ashwini - 09 SEPTEMBER 2017
React.js was developed by Facebook to address its need for a dynamic and high performing User Interface(UI). In 2011, Jordan Walke and his team from Facebook released the React JS library, a JavaScript library which brought together the speed of JavaScript and a new way of rendering pages, leading to a responsive and dynamic user input. In 2015, two years after the team open sourced React.js and its popularity grew, they released React Native.
Below is an overview of the business advantages of working with both React.js and React Native. It should give you a fair idea of their respective strengths and what makes them different.
React.js
React.js often referred to as React or ReactJS is a JavaScript library responsible for building a hierarchy of UI components or in other words, responsible for the rendering of UI components. It provides support for both frontend and server-side.
Remember, React.js is just the V part of the MVC framework, a library meant for rendering your views.
Business advantages while working with React:
DOM (document object model) is a viewing agreement on data inputs and outputs. React’s virtual DOM is faster than the conventional full refresh model, since the virtual DOM refreshes only parts of the page. The interesting part is, the team at Facebook wasn’t aware that partially refreshing a page would prove faster. Facebook was just looking for a way to reduce their re-build time, and partial DOM refresh was just a happy consequence. This increases performance and faster programming.
You can reuse code components in React JS, saving you a lot of time.
The rendering of your pages completely, from the server to the browser will improve the SEO of your web app.
It improves the debugging speed making your developer’s life easier.
Even to those unfamiliar with React, it is easily readable.Many frameworks require you to learn an extensive list of concepts which are only useful within the framework. React strives to do the opposite.
You reap the benefit of all the advancements in the Java language and its ecosystem.
React Native
React Native is a framework for building native applications using JavaScript. React Native compiles to native app components, which makes it possible for you to build native mobile applications. In React JS, React is the base abstraction of React DOM for the web platform, while with React Native, React is still the base abstraction but of React Native. So the syntax and workflow remain similar, but the components are different.
Business advantages of using React Native:
React Native comes with Native Modules and Native components that improve performance. Unlike Cordova, PhoneGap, and other cross-platform frameworks that render code via WebView, React Native renders certain code components with native API’s.
React Native comes with all the advantages that React.js brought you. React.js focuses on a better UI, so those benefits remain.
You don’t have to build the same application for iOS and Android, separately as React Native allows your developers to reuse the common logic layer.
React Native’s component-based structure allows developers to build apps with a more agile, web-style approach to development than most hybrid frameworks, and without any web at all.
If you know JavaScript, React Native will be easy to pick-up, allowing most front-end web developer to be a mobile developer. All you need to know is JavaScript, platform APIs, some native UI elements, and any other platform-specific design patterns and you’re set.
No need to overhaul your old app. All you have to do is add React Native UI components into your existing app’s code, without having to rewrite.
Native app development usually means inefficiency, slower time to deployment, and less developer productivity. React Native is all about bringing high speed, responsiveness, and agility of web app development along with effectual processing and best user experience to the hybrid space, to provide your users with a native app experience.
Conclusion (TL;DR)
React is a framework for building applications using JavaScript. React Native is an entire platform allowing you to build native, cross-platform mobile apps, and React.js is a JavaScript library you use for constructing a high performing UI layer. React.js is the heart of React Native, and it embodies all React’s principles and syntax, so the learning curve is easy. The platform is what gave rise to their technical differences. Like the browser code in React is rendered through Virtual DOM while React Native uses Native API’s to render components on mobile. React uses HTML and with React Native, you need to familiarize yourself with React Native syntax. React Native doesn’t use CSS either. This means you’ll have to use the animated API which comes with React Native to animate different components of your application.
Bottom line, React is ideal for building dynamic, high performing, responsive UI for your web interfaces, while React Native is meant to give your mobile apps a truly native feel.
https://www.cognitiveclouds.com/insights/what-is-the-difference-between-react-js-and-react-native/
WHAT IS THE DIFFERENCE BETWEEN REACT.JS AND REACT NATIVE?的更多相关文章
- React.js Tutorial: React Component Lifecycle
Introduction about React component lifecycle. 1 Lifecycle A React component in browser can be any of ...
- React.js入门笔记
# React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...
- React JS 基础知识17条
1. 基础实例 <!DOCTYPE html> <html> <head> <script src="../build/react.js" ...
- react.js 从零开始(一)
React 是什么? 网络上的解释很多...我这里把他定义为 通过javascript 的形式组件化 html的框架... React 仅仅是 VIEW 层. React 提供了模板语法以及一些函数钩 ...
- 【每天半小时学框架】——React.js的模板语法与组件概念
[重点提前说:组件化与虚拟DOM是React.js的核心理念!] 先抛出一个论题:在React.js中,JSX语法提倡将 HTML 和 CSS 全都写入到JavaScrip ...
- React.js基础入门
本文主要是针对React的一些demo教程.参考了菜鸟教程中的react教程,做了一些总结.Demo的下载链接是 https://github.com/RealAndMe/react-demo 下面要 ...
- React.js入门
React 入门实例教程 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. ...
- React.js 之hello word
引入的js文件说明 react.js 是 React 的核心库 react-dom.js 是提供与 DOM 相关的功能 babel.min.js的作用是将 JSX 语法转为 JavaScript 语法 ...
- React.js/HTML5和iOS双向通信
最近,我使用WKWebView和React.js进行双向通信,自己写了React.js嵌入到Native中. Native操作Web,通过两种方式传值 第一种,通过JS传值给Native 通过这种方式 ...
随机推荐
- SQLServer字符串与数字拼接
1.使用cast‘’+cast(@ID as varchar) 2.使用LTrim‘’+LTrim(@ID) 感觉第二种方式代码简单,但是可读性不好.
- Java并发编程: CountDownLatch、CyclicBarrier和 Semaphore
java 1.5提供了一些非常有用的辅助类来帮助并发编程,比如CountDownLatch,CyclicBarrier和Semaphore. 1.CountDownLatch –主线程阻塞等待,最后完 ...
- golang学习笔记--包导入及go 常用命令及参数
包导入:包导入路劲即代码包在工作区的src目录下的相对路径. 同一个源码文件中导入的多个代码包的最后一个元素不能重复,否则引起编译错误,如果只导入不使用,同样会引起编译错误 若想导入最后一个元素名相同 ...
- C#中如何禁止WindowsMediaPlayer双击全屏显示
问题描述:在项目中使用WindowsMediaPlayer播放视频时,双击会出现视频全屏的效果,而且视频恢复后会暂停,除非再次双击返回后才能正常播放.那么如何禁止WindowsMediaPlayer的 ...
- Big Data Hubris:"大数据傲慢"问题
大数据的傲慢与偏见— 读后心得 数据模型研究者必看的书 原文链接: https://medium.com/@iven00000000/%E5%A4%A7%E6%95%B8%E6%93%9A%E7%9A ...
- Throwable中几个常见方法。
getMessage();//获取异常信息,返回字符串.例如: toString();//获取异常类名和异常信息,返回字符串.例如: printStackTrace();//获取异常类名和异常信息,以 ...
- ajxa和axios的区别
1.axios 原理还是属于 XMLHttpRequest, 因此需要实现一个ajax. 2.但还会需要一个promise对象来对结果进行处理.3.ajax实现var Ajax={ get: func ...
- 谈谈游戏服务端SDK接入
“接sdk其实本质上就是一个对着接口文档写adaptor的工作,重复和无味.” 团队减员,身负多职,上一次调SDK已经可以回溯到游戏测试前夕了... 一般SDK只包含验证和支付功能,绝少部分SDK包含 ...
- 下载安装Tomcat教程
注:由于我的笔记不知怎么滴不能复制粘贴我就直接贴图了
- Java 之 线程安全(线程同步)
一.线程安全 当有多个线程同时运行,而这些线程可能会同时运行这段代码.程序每次运行结果和单线程运行的结果是一样的,而且其他的变量的值也和预期的是一样的,这就是线程安全的. 下面通过一个案例来演示线程的 ...