【原生APP和混合开发与H5对比】
1、前者有更合适的线程模型,尽管Web Worker可以解决一部分问题,但如图像解码、文本渲染仍无法多线程渲染,这影响了Web的流畅性。当大量用户访问H5应
用时,或者要加载大图片资源时,效率降低,图片可能会出现失真的情况
2、原生APP拥有成熟的第三方库和组件,相比react native和H5更为有优势,react native的组件和库没有那么全,性能会比源生略差一点
【虚拟DOM】
1、组件并不是真实的 DOM 节点,而是存在于内存之中的一种数据结构,叫做虚拟 DOM (virtual DOM)。
【DOM Diff算法】
1、Web界面由DOM树来构成,当其中某一部分发生变化时,其实就是对应的某个DOM节点发生了变化。前后两个状态就对应两套界面,然后由React来比较两个界
面的区别,这就需要对DOM树进行Diff算法分析。
2、它可以极大提高网页的性能表现
【react native语言环境JSX】(必须要引入babel的JSX解析器,把JSX转化成JS语法)
JSX的特点:
1、类XML语法容易接受,结构清晰
2、增强JS语义
3、抽象程度高,屏蔽DOM操作,跨平台
4、代码模块化
【JSX注释注意点】
1、在VIEW里面注释要用{} eg {/*2222*/}
【修改APP名字】
1、 里面的info.plist修改
【APP是编译型运行,浏览器解析型运行】
1、编译型语言:定义:指用专用的编译器,针对特定的操作平台(操作系统)将某种高级语言源代码一次性翻译成可被硬件平台直接运行的二进制机器码(具
有操作数,指令、及相应的格式),这个过程叫做编译;编译好的可执行性文件(.exe),可在相对应的平台上运行(移植性差,但运行效率高)。
2、解析型语言:定义:指用专门解释器对源程序逐行解释成特定平台的机器码并立即执行的语言;相当于把编译型语言的编译链接过程混到一起同时完成的。
解释型语言执行效率较低,且不能脱离解释器运行,但它的跨平台型比较容易,只需提供特定解释器即可。
【没有继承CSS样式概念】
1、子元素里面没有继承父元素css一说
【getDefaultProps】(ES5函数)
1、该函数用于初始化一些默认的属性
2、ES6中通过组件.defaultProps = {name: "abc"};(写在组件外面) 在上下文中直接 {this.props.name}
3、当不通过defaultProps定义默认值,在上下文直接调用this.props. 可以自定义组件,通过父级传值改变组件状态
【getInitialState】(ES5函数)
1、 该函数是用于对组件的一些状态进行初始化
2、ES6中通过在组件中写
constructor(props){
super(props);
//初始状态 == getInitialState函数
//数据驱动界面
this.state = {
height: '60cm';
};
}
//在上下文通过this.state. 拿值, 通过this.setState({height: this.state.height ==3})改值,达到刷新页面效果
【React Native组件的生命周期】
1、React Native组件的生命周期大致上可以划分为实例化阶段、存在阶段和销毁阶段,其中最常用的为实例化阶段,该阶段就是组件的构建、展示时期,需要
我们根据几个函数的调用过程,控制好组件的展示和逻辑的处理。
2、getDefaultProps -> getInitialState -> componentWillMount -> render -> componentDidMount