自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(238)
  • 资源 (60)
  • 收藏
  • 关注

原创 前端工程化-基于 monorepo 模式下的 lerna 实践

前端工程化-基于 monorepo 模式下的 lerna 实践

2021-05-17 10:32:55 55

原创 Genebox前端代码工程化的演进与实践

Genebox代码工程化演进

2021-04-24 15:04:06 34

原创 Genebox小程序持续交付平台化解决方案

背景流程长且无明确规范,导致整个过程较为艰辛。下图展示了一次发版工作最基本的工作内容,其中还省略了各种通知、确认环节。可以看到,前端研发在其中承担了较多的重复工作。问题 1. 多个/多端小程序同时发版上传操作需要打开各自平台不同的开发者工具(多端情况下),后续送审、发布环节则需要在各小程序管理后台进行手工操作(重复繁琐)。开发周期紧张,发版频率高没有固定的发版周期,单个小程序每周可能会发布n次,对于前端同学来说,这可能意味着需要更频繁的在正常工作及发版任务中进行切换,...

2021-04-10 11:26:21 101

原创 AOP在Genebox小程序网络请求上的应用

genebox-mini-request 是基于JS Decorator 和 Taro 实现的网络请求,专注于实现对网络请求的使用优化。背景当前小程序端网络请求模块使用 request utils 统一处理,通过配置请求模块,动态生成 request task,并通过该实例发起请求。额外的 options 配置参数需要单独传入高阶函数,目前仅支持header,超时时长配置。存在的问题: 请求参数配置存在一定局限性,不易扩展 请求模版的创建增加重复性代码 请求模版配置与具体使用分离,

2020-11-04 21:01:38 179

原创 Git submodule 在实际开发中的应用

Git子仓库在实际开发中的应用

2020-10-09 15:33:34 285

原创 React Native Merge Flutter 混合开发实践

React Native Merge Flutter 混合开发实践

2020-07-14 14:39:48 439

原创 React Native 暗黑模式适配实践

React Native 暗黑模式实践方案

2020-05-20 15:34:14 2817 1

原创 React Native 三端同构实践

React Native三端同构实践

2020-04-19 15:57:54 2543

原创 React Native 函数式组件优化实践

React 性能优化理念的主要方向简单概括为两个:减少重新 render 的次数。因为在 React 里最重(花时间最长)的一块就是 reconciliation(简单可以理解为 diff),如果不 render,就不会 reconciliation。 减少计算的量。主要是减少重复计算,对于函数式组件来说,每次 render 都会重新从头开始执行函数调用。关于类组件的渲染优化,...

2020-04-14 14:27:33 1524

原创 React Native 包体积优化实践

React Native 包体积优化实践

2020-04-06 16:54:07 890

原创 React Native SDR 实践

React Native SDR实践

2020-03-22 17:00:33 504 6

原创 Git代码提交规范

随着团队不断扩大,git 的 commit 信息需要按照一定的格式规范,以便在需要的时候方便使用。提交信息可以方便的定位问题, 代码 review 的时候也知道了该次 commit 干了什么,所以 commit 标准化好处很多,不再多说实现 结合 git hook 实现在 git commit 阶段检查输入是否符合规范,符合通过,反之提示工具commitlint:用于检查提交信息,...

2020-03-04 16:44:38 854

原创 原生端(iOS和Android)读取ReactNative本地图片

源码已上传Github:https://github.com/songxiaoliang/native-read-rn-image在ReactNative开发过程中,有时需要在原生端显示RN里的图片,这样的好处是可以通过热更新来更新APP里的图片,而不需要发布原生版本,而ReactNative里图片路径是相对路径,类似'./xxximage.png'的写法,原生端是无法解析这类路径,那么如果将...

2019-05-24 19:49:15 2476

原创 Detox实现ReactNative E2E自动化测试

Detox 是什么?在创建新功能或修复错误后,我们通常会在我们的设备上安装该应用并手动测试。但是,当我们想要在标记版本之前验证所有新旧功能时,此过程可能会很麻烦。解放双手,是我们梦寐以求的。Detox,一个用于测试 React Native 应用程序 Selenium 界面的端到端自动化测试工具。Detox 是为移动端APP打造的灰盒端到端自动化测试框架。在 ReactNat...

2019-05-16 21:41:55 1600 2

原创 React Native字体适配解决方案

源码已上传 Github:react-native-app-font“怎么又是字体,老常的话题现在还拿出来说。关于字体适配的解决方式网上一搜几十篇!”。看到标题的烙铁心里一万个xxx疾驰飞腾。But! 我总是会给大家带点什么惊喜。关于 pxToDp、启动缩放 我们一点不说。本篇博客的主题很简单:如何控制App字体不随系统字体改变?系统字体改变一般有两种情况:(1)调整系统字...

2019-05-12 22:40:51 3057

原创 React Native图片资源使用方案

图片资源( jpeg、png、svg、webp ... )作为与用户交互的界面元素,在客户端产品中起到了非常重要的角色作用。在应用开发中,移动端与PC的图片使用策略也有所不同。PC端较大的内存容量,快速的渲染能力使各类型图片资源都能得到较好的使用。而移动端由于设备内存,GPU渲染都与PC有较大差别,所以在App应用开发中,需要我们单独分析处理。今天我们聊聊在React Native开发中,如...

2019-04-02 16:38:04 1020

原创 在 React Native 中使用 Hooks

React官方在 2018 ReactConf 大会上宣布 React v16.7.0-alpha(内测) 将引入 Hooks。什么是Hooks,我们来了解一下。什么是Hooks?在平时开发过程中,我们一般都会遇到如下问题:1. 难以重用和共享组件中的与状态相关的逻辑2. 逻辑复杂的组件难以开发与维护,当我们的组件需要处理多个互不相关的 state 时,每个生命周期函数中可能会包含...

2019-03-13 16:15:03 6940 3

原创 Android 集成 Flutter 及通信交互详解

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。前不久开源了用Flutter开发的一个音视频类App客户端,欢迎大家star, fork。⚠️ 项目地址:https://github.com/songxiaoliang/visitor-flutter⚠️ 本篇博客涉及的源码全部开源在Github,地址:https://github.com/songxiao...

2019-01-28 16:18:03 4384 1

原创 基于 Flutter 视频客户端 Vistor【已开源】

项目已开源到 Github:Vistor,欢迎大家 fork,star。模块开发环境:Vs Code (1.30.2) Android Studio 3.+开发框架 ( Flutter sdk: ">=2.0.0-dev.68.0 <3.0.0" ):状态管理:Scoped_model 网络层:Dio 导航库:Fluro主模块分为首页...

2019-01-24 10:16:10 12098 18

原创 Flutter以两种方式实现App主题切换

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。概述App主题切换已经成为了一种流行的用户体验,丰富了应用整体UI视觉效果。例如,白天夜间模式切换。实现该功能的思想其实不难,就是将涉及主题的资源文件进行全局替换更新。说到这里,我想你肯定能联想到一种设计模式:观察者模式。多种观察对象(主题资源)来观察当前主题更新的行为(被观察对象),进行主题的更新。今天和大家分...

2018-12-26 11:29:27 9288 4

原创 Flutter优化之将小部件拆分为方法将影响渲染性能

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。在React Native跨平台开发框中,我们经常会看到,当界面组件层次嵌套深,组件交互涉及业务逻辑时,为了代码层次简洁、清晰,都会将组件拆分到方法中,然后在主布局中引入,例如:render() { return ( &lt;View style={{ flex: 1, backgroundCo...

2018-12-22 15:56:07 1595 4

原创 CodePush优化之减小更新包体积

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。述还有 10 天就要迎来 2019 新年,感慨 18 年过的好快,恍恍惚惚。2018 年经历了很多,人生最重要的事情,很开心。闲余时间浏览了这一年写过的博客,9 篇相对 17 年少了很多。时间不等人,什么事还是要提前计划往前做。本来是要等新年再和大家分享新的内容,回头看看还是以整数结尾这一年,也算欣慰。这篇博...

2018-12-19 16:21:01 1083 6

原创 RN JSBundle 拆分解决方案(3): 固定ModuleId,JSBundle按需加载

实践源码:react-native-split-bundle:https://github.com/songxiaoliang/react-native-split-bundle前面两篇文章分别从源码加载、Bundle文件结构、Metro打包工具等做了简单分析,逐步了解关于RN打包,Bundle 文件加载的相关内容。本篇内容将结合代码来完成最终的实现方案。在阅读该篇博客内容前,可以点击如...

2018-11-30 12:56:28 2905 5

原创 RN JSBundle 拆分解决方案(2): JSBundle 、Metro 结构分析

 在第一篇(RN JSBundle 拆分解决方案(1): 应用启动、视图加载原理解析)中我们对RN的启动、视图加载流程从源码角度做了简单的梳理。本篇内容我们继续对JSBundle 文件内容结构,以及当前RN框架默认的打包工具 Metro 进行分析。JSBundle 文件结构当我们执行 react-native bundle | unbundle 命令时,RN框架会按照当前给定的参数,打...

2018-11-27 18:35:56 3669

原创 React Native BackHandler exitApp 源码分析

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。概述昨天技术交流群里有个朋友提出一个问题,在 Android 中嵌入了 React Naitve,并且想从RN层执行代码,回到上一个原生Activity。说起来比较模糊,假设他的界面执行流程如下:ActivityA→ActivityB →RNActivityA→ JS端执行代码→...

2018-11-22 17:29:28 1703

原创 React Native 手势触摸事件机制详解(进阶篇)

 源码已开源到Github,详细代码可以查看:《React Native 触摸事件代码实践》。在基础篇,对RN中的触摸事件做了详细的介绍。相信大家对于触摸事件流程机制有了更为清晰的认识。没有浏览的可以先看看基础篇:《 React Native 手势触摸事件机制详解(基础篇)》本篇博客中,同样延续基础篇中结尾的内容,对触摸事件的执行流程从代码层执行流程进行更深的说明,并使用RN系统提供的...

2018-10-20 14:41:11 3559 1

原创 React Native 手势触摸事件机制详解(基础篇)

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 源码已开源到Github,详细代码可以查看:《React Native 触摸事件代码实践》。 博客产出拖延了很久,老早定的主题现在才开始写。之前群里朋友对于React Native(以下简称RN)中手势触摸相关问题提出的频率很高,并且在实际开发过程中较难理解和处理。本篇内容将围绕...

2018-09-26 16:07:47 5396

原创 React Native v0.56.0 最新版本更新日志

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。React Native v0.56.0 已发布,这也是属于 6 月的更新发布!FB开发团队表示,自3月以来,超过 60 位贡献者贡献了 816 个 commit。另外,由于这个新版本有一些重要的破坏性变化需要大量的额外工作才能使其达到稳定的状态,这也是月度发布周期中跳过4月和5月的主要原因。同时官方表示,...

2018-07-05 15:07:14 2350

原创 React Native封装Android原生UI组件最详教程

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。篇幅预计阅读时间10分钟,结尾有福利~~ 前些天群里有朋友说想了解如何在React Native项目中使用封装原生View组件,之前有写过一篇Android原生层与React Native 交互的文章,感兴趣的朋友可以看一下。今天要分享的如何封装原生View组件在React Native项目中...

2018-04-17 18:16:58 7894 3

原创 React Native未来导航者:react-navigation 使用详解(进阶篇)

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。本篇内容为react-navigation的进阶内容以及高级用法。基础篇请看:React Native未来导航者:react-navigation 使用详解(基础篇)(1)适配顶部导航栏标题: 测试中发现,在iphone上标题栏的标题为居中状态,而在Android上则是居左对齐。所以需要我们修改源码,...

2018-03-06 17:44:25 4094 4

原创 RN JSBundle 拆分解决方案(1): 应用启动、视图加载原理解析

前两篇文章和大家分享了RN中的触摸事件机制。链接如下:React Native 手势触摸事件机制详解(基础篇)React Native 手势触摸事件机制详解(进阶篇)接下来的系列内容将结合 Android 原生层来分析拆包解决方案。如果你具有Android原生开发经验,并且在实践 Android + RN 的混合模式开发,那么这次连载的文章内容你一定喜欢。拆包解决方案的系列内容目录大致...

2018-02-22 14:57:46 3167 4

原创 React Native集成Sentry错误日志统计

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。App版本升级想必大家都不陌生。原生开发中App升级方式有很多种,Android和iOS也不尽相同。大致区别如下:App错误收集的实现方式有很多,例如友盟、Bugly、阿里云、Sentry等等。本篇博客和大家分享一下在React Native中集成Sentry的流程和注意事项。在React Native...

2017-12-04 21:25:16 6069

原创 简析 React Native 用户反馈功能实现

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。该库已开源到Github,地址请点击:react-native-feedback 【一行代码,双平台反馈】用户反馈功能在App中屡见不鲜了。尤其是创业公司,在前期都会添加该功能来帮助自己更好的定位产品,以及收集产品的问题。在App中实现该功能大概有两种:(1)搭建自己的私有服务器,收集反馈数据...

2017-11-18 11:48:51 1854 4

原创 简析在React Native中如何适配iPhoneX

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。一、介绍iPhone X 发布也有一段时间了,独特的 "齐刘海",以及 "小嘴巴" 带给了苹果粉们无限的遐想,同时也带来众多的吐槽。前几天,招商银行公众号在微信推送了一条消息,11月招商银行App要发布最新版本,完美适配iPhoneX,是国内第一家银行App适配iPhoneX。感兴趣的朋友可以去下...

2017-11-09 12:40:42 9738 5

原创 CodePush热更新常用命令与注意事项

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。总结了一些在CodePush中比较常用的命令以及注意事项,供大家参考。一、更新流程图片来源:http://www.jianshu.com/p/cbc6a1dbfe30二、常用命令// 账户相关code-push login 登陆code-push loout 注销code-push a...

2017-10-25 18:43:18 9741

原创 React-Native ART 绘图简析

 刚创建的React Native 微信公众号,欢迎微信扫描关注订阅号,每天定期会分享react native 技术文章,移动技术干货,精彩文章技术推送。同时可以扫描我的微信加入react-native技术交流微信群。欢迎各位大牛,React Native技术爱好者加入交流!本篇博客依旧是关于 React Native 的开发内容。今天和大家唠唠 React Native 中绘图机制:...

2017-10-23 16:24:33 2982

原创 React Native App版本升级方案解析

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。源码已开源到Github,地址请点击:react-native-upgrade欢迎大家star,fork.....App版本升级想必大家都不陌生。原生开发中App升级方式有很多种,Android和iOS也不尽相同。大致区别如下:(1)iOS中由于不能从App Store之外下载ipa文件进行安...

2017-08-15 14:43:26 12753 31

原创 React Native实现第三方分享、登录功能(Android,IOS双平台)

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。源码已开源到Github,地址请点击:react-native-share【一行代码,双平台分享】目前支持分享的平台有【QQ】【QQ空间】【微信】【朋友圈】【微博】【FaceBook】 欢迎大家star,fork.....【 Android平台配置 】1. app目录下创建libs文件...

2017-07-12 20:30:27 14561 36

原创 React-Navigation与Redux整合详解

继react-navigation发布已经过去半年的时间,想必React Native的玩家早已玩转于

2017-07-03 14:42:49 3066 2

原创 Android布局加载React Native视图

一、需求分析前几篇博客中,和大家分享了关于React Native For Android 的一系列内容,以及React Native第三方库的使用技巧。今天和大家分享的内容可以算是React Native基于最新版本实现JsBundle预加载,界面秒开优化延伸。本篇博客内容围绕的依然是如何加载RN界面,在JsBundle加载优化这篇博客中,我们从源码角度分析了如何实现快速加载

2017-06-30 12:32:56 3976 3

App版本升级更新

App版本升级更新,集成轻松搞定

2016-11-03

实现下拉式窗帘动画和上拉式抽屉Android动画

Android动画实战 一 实现下拉式窗帘动画和上拉式抽屉动画,详细解析可以看http://blog.csdn.net/u013718120/article/details/51161989

2016-04-16

drag-sorts

react-native平台实现的拖拽组件,简单已用,可以结合多种动画实现!!组件化模块化!!!!!!!

2020-09-08

React Native 单选,多选控件

React Native 单选,多选控件,完全支持自定义。

2017-08-04

仿QQ微信登录页面

仿QQ微信登录页面,分享给大家!

2015-12-07

Android集成高德定位

在Android中基于高德实现定位功能,代码很详细。

2016-09-23

Android View动态热更新

Android View动态热更新,带你立刻上手完成动态更新View!

2016-12-20

EditText自动搜索

基于EditText根据用户输入动态实现自动搜索功能。

2016-09-06

附加动画的DialogFragment

Android中基于DialogFragment实现的Dialog提示功能,附加了nice的动画效果。

2016-09-11

高仿Path动画

组合Android动画实现一个高仿Path菜单动画效果,小伙伴们赶紧尝尝鲜吧!

2016-04-14

React Native 视频播放器

React Native 视频播放器,自定义封装。支持暂停播放,快进,全屏等效果。

2018-01-07

仿天猫App实现商品列表布局切换效果

高仿天猫App商品列表布局切换效果,切换顺畅,采用多布局完美实现!

2016-07-20

高仿天猫App实现商品列表布局切换效果

高仿天猫App商品列表布局切换效果,切换顺畅,采用多布局完美实现,并添加了切换的动画效果!

2016-07-20

React Native 瀑布流列表

React Native 瀑布流列表,用于展示瀑布流形式的内容,定制简单。

2018-07-05

Android动态更新图标

Android动态更新图标,几行代码搞定复杂问题!

2016-12-27

Android Studio Html插件

Android Studio Html插件,在As中即可轻松编辑Html,css。

2016-12-07

Android RecyclerView批量操作

Android 中基于RecyclerView实现Item内容的批量删除,全选操作。

2016-09-07

diff_match_patch

google-diff_match_patch:Java版本补丁包库文件

2017-05-04

Android JPush SDK 集成文档

Android JPush SDK 集成文档,快速集成极光推送服务功能!

2016-01-15

Android水印效果

Android中实现界面布局文字水印,已封装,可复用。

2017-06-29

Android屏幕适配尺寸生成类

Android屏幕适配尺寸生成类,直接导入工程运行,即可生成Android中屏幕的个尺寸下的values文件,非常使用!

2015-12-12

SlidingUpPanel

一个基于SlidingUpPanel实现的Android托盘滚动效果!

2016-05-31

app-releaseStaging.apk

app-releaseStaging.apk

2019-11-11

返回键退出程序的两种方式

返回键退出程序的两种方式,实现了在Adnroid中按返回键如何实现退出应用程序!

2015-12-07

Android实现快速高斯模糊

Android实现快速高斯模糊,对其进行了优化,速度更快,效果更好!!

2016-07-21

Android白天夜间模式切换

一款支持白天夜间切换的工具

2016-10-17

zxing jar包

zxing jar包,集成项目完美实现二维码扫描功能!

2016-06-15

swipelibrary

Github上SwipeLayout的Eclipse环境下的集成library。之前集成Github上的swipeLayout.jar不能实现,就自己集成了一个library。方便大家使用,分享给大家!

2015-12-07

ShareSDK分享功能封装

Android中基于ShareSDK分享功能的封装工具类,让你App不到一分钟搞定分享功能。

2016-10-27

children在react中的应用.key

关于React Children 使用的一次内部技术分享! 包含了高级Api的使用, 以及组件化的思想.可下载查看全部内容......

2019-12-16

RecyclerView动画

实现RecyclerView列表项的展示动画,丰富RecyclerView展示效果。

2017-04-27

android进程保活

对App进程的保活处理,延长App的驻留内存时长,并在主进程回收后拉起。

2016-12-16

React Native Modal

React Native Modal,支持定位显示等等!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!1

2017-09-21

Android 门票布局效果

Android带你实现门票布局效果 ,非常nice!就是这么nice!

2016-07-30

Loading加载动画

一套精美的Loading加载动画,你值得拥有!

2016-04-21

Android - BadgeView

简单集成在Android项目中,轻松实现在App中实现数字等提示标签。

2015-12-07

Android仿当当App首页按钮渐变动画

Android仿当当App首页按钮渐变动画,效果非常绚丽。大家可以下载体验扩展。

2016-08-05

eclipse主题sublime插件

eclipse主题sublime插件,一键import,使用非常方便,让你的界面好看的飞起来,欢迎下载!

2016-03-01

App版本更新

Android中App版本升级更新下载的封装工具类,简单实用。几行代码轻松搞定升级安装!

2016-11-03

zxing实现二维码扫描

基于zxing实现的二维码扫描,解决所有bug!完美解决方案

2016-06-15

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除