vue和react的性能优化

vue的性能优化

vue性能优化
          1.路由懒加载
          2.图片懒加载
          3.函数防抖 节流
          4.keep-alive 缓存组件
          5.cdn引入第三方库 (资源使用的第三方的资源)
          6.v-for使用key 可以高效复用更新之前节点的内容
          7.v-for绑定事件 使用事件委托的方式
          8.Object.freeze 如果数据只需要展示 而不是成为响应式属性
          9.使用函数组件
    10.资源按需加载
    
单页应用的优点
	 1.切换路由时 不会重重新获取页面的所有资源 只会重新发送网络请求获取数据渲染组件
	 2.前后端分离  前端只需要发送网络请求获取数据  后端只需要写接口提供数据就可以了 分工明确

	缺点
	 1.不利于seo
	 2.导航不可用
	 3.初次加载时耗时多

react的性能优化

react性能优化
	1.路由懒加载
		import  React,{lazy,Suspense} from "react";
		//引入
		const Login = lazy(()=>import("路由地址"));
		//使用
		//fallback是当组件还没有加载过来的时候显示的
		<Suspense fallback={<div>loading...</div>}>
			<Switch>
				<Rout path="/login" component={Login} />
			</Switch>
		</Suspense>
	2.图片懒加载
	3.函数防抖 节流
	4.cdn引入第三方库 (资源使用的第三方的资源)
	5.for使用key 可以高效复用更新之前节点的内容
	6.for绑定事件 使用事件委托的方式
	7.使用函数组件
	8.资源按需加载