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 通过这种方式 ...
随机推荐
- Oracle的约束
学习笔记: ##约束 *概念:限定用户输入的内容. *案例: *练习 * 1. 在score表的grade列添加CHECK约束,限制grade列 ...
- C#MVC中ViewData和ViewBag的使用
ViewBag和ViewData的区别 ViewData ViewBag 它是key/value字典集合 它是dynamic类型对象 从asp.net mvc1就有了 从asp.netmvc3才有 基 ...
- Kubeadm 1.9 HA 高可用集群本地离线镜像部署【已验证】
k8s介绍 k8s 发展速度很快,目前很多大的公司容器集群都基于该项目,如京东,腾讯,滴滴,瓜子二手车,易宝支付,北森等等. kubernetes1.9版本发布2017年12月15日,每三个月一个迭代 ...
- Puppet自动化管理配置
Puppet:开源系统配置和管理工具 随着虚拟化和云计算技术的兴起,计算机集群的自动化管理和配置成为了数据中心运维管理的热点.对于 IaaS.Paas.Saas 来说,随着业务需求的提升,后台计算机集 ...
- poj 2102 A计划
可怜的公主在一次次被魔王掳走一次次被骑士们救回来之后,而今,不幸的她再一次面临生命的考验.魔王已经发出消息说将在T时刻吃掉公主,因为他听信谣言说吃公主的肉也能长生不老.年迈的国王正是心急如焚,告招天下 ...
- VC/MFC如何添加启动界面
2015-05 转自 香远益清原文VC/MFC如何添加启动界面 1.基于框架类的应用程序添加启动画面的步骤(利用组件库中的Splash Screen组件生成Splash1.cpp 和Splash1.h ...
- 【开发笔记】-CentOS配置Java环境变量
如果开发java应用,经常需要配置JAVA_HOME路径,如果是通过yum安装的jdk(一般系统会自带open-jdk),下面讲述配置过程: A 定位JDK安装路径 1. 终端输入: which ja ...
- JS 数组克隆方法总结(不可更改原数组)
ES5 方法总结 1.slice let arr = [2,4,434,43]; let arr1= arr.slice();//let arr1 = arr.slice(0); arr[0] = ' ...
- Python学习日记(三十八) Mysql数据库篇 六
Mysql视图 假设执行100条SQL语句时,里面都存在一条相同的语句,那我们可以把这条语句单独拿出来变成一个'临时表',也就是视图可以用来查询. 创建视图: CREATE VIEW passtvie ...
- Golang: 并发抓取网页内容
在上一篇中,我们根据命令行的 URL 参数输入,抓取对应的网页内容并保存到本地磁盘,今天来记录一下如何利用并发,来抓取多个站点的网页内容. 首先,我们在上一次代码的基础上稍作改造,使它能够获取多个站点 ...