郝捷的专栏

一. 拆包动机RN作为非常优秀的移动端跨平台开发框架，在近几年得到众多开发者的认可。国内各大厂采用在当前原生应用内集成RN的方式，使得App应用的灵活性得到了很大的提升。在原生应用内嵌入RN，就是需要在原生应用内加载RN模块（1个或多个JSBundle），并得以显示。JSBundle中包含了当前RN模块的js代码。如果存在多个RN模块需要被加载时，就需要分别打出多个JSBundle，并且多个JS...

一.原生加载流程我们知道RN的页面也是依托Activity，React Native框架里有一个ReactActivity，它就是我们RN页面的容器。ReactActivity里有个ReactRootView，正如它的名字那样，它就是ReactActivity的root View，最终渲染出来的view都会添加到这个ReactRootView上。ReactRootView调用自己的startR...

原生分析的是安卓端核心代码//react-native/vendor/core/wehatwg-fetch.jsself.fetch = function(input, init) { return new Promise(function(resolve, reject) { var request = new Request(input, init); v...

分享内容全局属性Context性能监控debug工具一.全局属性Context1.概念当你不想在组件树中通过逐层传递props或者state的方式来传递数据时，可以使用Context来实现跨层级的组件数据传递。上图，使用props或者state传递数据，数据自顶下流。使用Context，可以跨越组件进行数据传递。使用Context如果要Context发挥作用，需要用到两...

背景起因是在排查公寓找室友bundle过大问题时，发现house-middle-sdk体积异常，逐个删减引用得出结论是引用了node-forge库导致，通过这次手动排查经历演化出做一个bundle自动化静态扫描的想法。介绍安装npm i house-cli -g使用根目录添加metro.config.js文件//里面引用全局路径（这个后面优化一下）module.exports ...

目的之前一直用chrome调试，一个是不习惯前端调试方法，毕竟是android 出身嘛还是习惯IDE调试，还有就是源码位置总要滑到底才能找到，很麻烦。突然发现ReactNative也能用IDE调试真是喜出望外啊，将配置和调试方法记录一下。IDE设置首先配置项，点击Edit Configurations然后配置react native启动项 其中有几点说明一下

Android原生项目转RN项目

ps: 坑多的有点过分啊亲~错误1变更sdk目录后adb找不到 解决方案：修改ANDROID_HOME错误2react-native run-android Android project not found 解决方案： 应该在根目录执行转换将项目名改为androidsetting中加rootProject.name = 'MyappProject'错误3curl指令找不到 解决方

文章目录前言概念ResolutionTransformationSerialization打包方式MoudlesPlain bundleIndexed RAM bundleFile RAM bundle流程前置流程resolve流程Transformer流程序列化流程缓存为什么要缓存缓存的请求与缓存Metro配置结构前言metro是一种支持ReactNative的打包工具，我们现在也是基于他来...