BestHub
Sign in
Tagged articles

React Native

187 articles · Page 2 of 2
58 Tech
58 Tech
Jul 17, 2020 · Mobile Development

React Native Performance Optimization: Principles, Bottlenecks, and Practical Practices

This article analyzes the performance bottlenecks of React Native applications, explains the framework's working principles, and presents practical optimization strategies such as bundle splitting, JS bytecode, data synchronization via an information center, and native‑driven list components to improve rendering speed and responsiveness.

Cross-PlatformMobile DevelopmentOptimization
0 likes · 9 min read
React Native Performance Optimization: Principles, Bottlenecks, and Practical Practices
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Jul 13, 2020 · Mobile Development

How WYBridge Unifies Bridge APIs Across React Native, Flutter, Weex, and Web

WYBridge provides a unified bridge layer for multiple cross‑platform containers—React Native, Flutter, Weex, and Web—standardizing API definitions, registration, parsing, and invocation across Android and iOS, while offering compatibility solutions for legacy method calls and detailing implementation specifics for each platform.

AndroidCross-PlatformFlutter
0 likes · 24 min read
How WYBridge Unifies Bridge APIs Across React Native, Flutter, Weex, and Web
Ctrip Technology
Ctrip Technology
Jun 29, 2020 · Frontend Development

React Native Rendering Performance Optimization Practices at Ctrip

This article analyzes the challenges of React Native rendering performance, introduces quantitative metrics such as FMP and TTI, and presents practical optimization strategies across native containers, bundle handling, API bridging, front‑end code slimming, service request prioritization, and tooling for offline and online performance analysis.

FMPReact NativeTTI
0 likes · 18 min read
React Native Rendering Performance Optimization Practices at Ctrip
Ctrip Technology
Ctrip Technology
Jun 11, 2020 · Mobile Development

RTL Localization and Design Guidelines for Trip.com Arabic Site

This article details Trip.com’s comprehensive approach to adapting its mobile applications for Arabic users, covering cultural research, RTL design principles, mirroring rules, icon and typography handling, as well as platform‑specific technical solutions for Android, iOS, and React Native.

AndroidLocalizationMobile Development
0 likes · 14 min read
RTL Localization and Design Guidelines for Trip.com Arabic Site
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Jun 1, 2020 · Mobile Development

How WYNavigation Unifies RN and Native Navigation Stacks for Seamless Hybrid Apps

This article explains the challenges of mixing React Native and native pages, critiques existing routing solutions, and introduces WYNavigation—a single‑engine, multi‑container framework that aligns RN navigation with native stacks, detailing its concepts, lifecycle handling, routing methods, and implementation code.

AndroidHybrid NavigationMobile Development
0 likes · 10 min read
How WYNavigation Unifies RN and Native Navigation Stacks for Seamless Hybrid Apps
Ctrip Technology
Ctrip Technology
May 14, 2020 · Frontend Development

Applying Rematch State Management in Ctrip Train Ticket Module: Experience, Issues, and Solutions

This article details Ctrip's practical experience of refactoring its train‑ticket RN module with the Rematch state‑management framework, outlining the background problems of Redux, the three‑phase migration plan, specific challenges such as store compatibility, component decoupling, reuse, and the resulting code‑size reduction and readability improvements.

Component DecouplingCtripReact Native
0 likes · 11 min read
Applying Rematch State Management in Ctrip Train Ticket Module: Experience, Issues, and Solutions
Ctrip Technology
Ctrip Technology
Apr 30, 2020 · Frontend Development

Multi-Platform Frontend Architecture and Code Reuse Practices at Ctrip Play Team

This article describes how Ctrip's Play team tackled fragmented front‑end stacks, unified product requirements across PC, H5, Hybrid and React Native, and implemented a component‑driven, multi‑repo architecture that enables single‑source code to be built, tested, and released for multiple platforms simultaneously.

Code ReuseComponent ArchitectureReAct
0 likes · 11 min read
Multi-Platform Frontend Architecture and Code Reuse Practices at Ctrip Play Team
Ctrip Technology
Ctrip Technology
Apr 23, 2020 · Frontend Development

CTrip Flight App Frontend CI/CD and UI Automation Practices

This article details how CTrip's flight app transitioned to React Native and adopted BDD-driven CI/CD, introducing parallel linting, unit testing, automated publishing, a mock data platform, distributed UI automation, and multi‑process frameworks to achieve 95% test coverage, minute‑level execution times, and significantly reduced release costs.

CI/CDReact NativeUI automation
0 likes · 13 min read
CTrip Flight App Frontend CI/CD and UI Automation Practices
JD Retail Technology
JD Retail Technology
Apr 14, 2020 · Frontend Development

Integrating react-native-web into a React Native Project: A Step‑by‑Step Guide

This article explains how to extend a React Native project with react-native-web, covering the motivation, required dependencies, project setup, webpack and Babel configuration, entry‑file creation, AppRegistry usage, component implementation, and JDReact’s practical extensions for seamless multi‑platform deployment.

Cross‑PlatformReact NativeWeb Development
0 likes · 21 min read
Integrating react-native-web into a React Native Project: A Step‑by‑Step Guide
Ctrip Technology
Ctrip Technology
Mar 26, 2020 · Mobile Development

Implementing Dark Theme in Trip.com Mobile App: Design, iOS, Android, and React Native Solutions

This article details Trip.com’s comprehensive Dark Theme implementation across iOS, Android, and React Native, covering design principles, color mapping, illustration adjustments, platform‑specific adaptation techniques, code examples, and tooling that together reduced development effort while enhancing user experience and brand image.

AndroidMobile DevelopmentReact Native
0 likes · 17 min read
Implementing Dark Theme in Trip.com Mobile App: Design, iOS, Android, and React Native Solutions
HomeTech
HomeTech
Mar 25, 2020 · Mobile Development

Adopting React Native in the AutoMan App: Architecture, Implementation, and Future Outlook

This article details the AutoMan app's transition from native development to a React Native‑based cross‑platform solution, covering background challenges, framework selection, architectural layers, custom components, hot‑update mechanisms, and the accompanying mini‑program publishing platform.

Cross-PlatformHot UpdateMobile Development
0 likes · 16 min read
Adopting React Native in the AutoMan App: Architecture, Implementation, and Future Outlook
58 Tech
58 Tech
Mar 23, 2020 · Mobile Development

Dark Mode Adaptation Practices in the 58.com Mobile App

This article details the motivations, design goals, technical solutions for native iOS, React Native and Web pages, handling of large‑scale parallel development, compatibility strategies, performance measurements and future plans of the dark‑mode adaptation implemented in the 58.com mobile application.

AndroidMobile UIReact Native
0 likes · 20 min read
Dark Mode Adaptation Practices in the 58.com Mobile App
JD Retail Technology
JD Retail Technology
Mar 10, 2020 · Mobile Development

Understanding the React Native CLI: How It Creates and Configures a New RN Project

This article explains how the react-native-cli tool automates the creation of a React Native project by installing required software, generating the project structure from templates, installing node and iOS dependencies, and detailing the underlying code flow from the CLI entry point to the init and generateProject functions.

CLIMobile DevelopmentNode.js
0 likes · 22 min read
Understanding the React Native CLI: How It Creates and Configures a New RN Project
58 Tech
58 Tech
Feb 21, 2020 · Mobile Development

Performance Optimization and Technical Selection of Infinite List Components in React Native

This article examines how to choose and optimize infinite‑list components for React Native mobile apps, comparing ListView, FlatList and RecyclerListView, presenting frame‑rate benchmarks, discussing deterministic and non‑deterministic rendering techniques, memory‑recycling strategies for tabbed pages, and solutions for gesture‑overlap handling.

Infinite ListMobile DevelopmentPerformance Optimization
0 likes · 13 min read
Performance Optimization and Technical Selection of Infinite List Components in React Native
58 Tech
58 Tech
Feb 12, 2020 · Mobile Development

React Native Integration in 58 Car Dealer App: Architecture, Development Process, and Hot‑Update Strategy

This article presents a comprehensive case study of integrating React Native into the 58 Car Dealer mobile application, covering background, module selection, communication mechanisms, UI development, server design, hot‑update workflow, packaging, debugging, pitfalls, and future optimization directions.

AndroidHot UpdateMobile Development
0 likes · 20 min read
React Native Integration in 58 Car Dealer App: Architecture, Development Process, and Hot‑Update Strategy
Ctrip Technology
Ctrip Technology
Jan 16, 2020 · Frontend Development

Comprehensive Guide to Unit Testing in React and React Native Projects

This article presents a complete tutorial on setting up and using Jest, Enzyme, and react‑hooks‑testing‑library for unit testing React and React Native applications, covering environment configuration, simple function tests, lifecycle hooks, mocking, snapshot testing, asynchronous tests, Redux and Hook testing, as well as coverage reporting and CI integration.

EnzymeJestReAct
0 likes · 13 min read
Comprehensive Guide to Unit Testing in React and React Native Projects
Meituan Technology Team
Meituan Technology Team
Dec 19, 2019 · Mobile Development

Meituan React Native (MRN) Dynamic Framework: Architecture, Practices, and Performance

Meituan’s MRN framework extends React Native with a layered hybrid architecture, custom component library, multi‑bundle build strategy, and automated release pipeline, enabling rapid deployment of over 60 RN pages, cutting package size, improving productivity by over 50 %, and delivering high‑stability performance across Android and iOS.

Cross-PlatformMeituanReact Native
0 likes · 34 min read
Meituan React Native (MRN) Dynamic Framework: Architecture, Practices, and Performance
Sohu Tech Products
Sohu Tech Products
Dec 4, 2019 · Mobile Development

Top 10 Cross‑Platform Development Frameworks in 2020

This article surveys the most popular cross‑platform development frameworks of 2020—including Ionic, React Native, Flutter, Xamarin, NativeScript, Node.js, and others—detailing their key features, advantages, and suitability for building mobile applications that run on multiple operating systems.

Cross-PlatformFlutterIonic
0 likes · 15 min read
Top 10 Cross‑Platform Development Frameworks in 2020
58 Tech
58 Tech
Oct 30, 2019 · Mobile Development

Dynamic Feature Deployment for iOS Apps: NJCS Architecture and Implementation

This article explains the need for rapid iOS feature updates without re‑submission, defines dynamic feature deployment, compares existing solutions, and details the design, architecture, code examples, and security controls of the NJCS lightweight Objective‑C runtime‑based dynamic deployment framework.

Mobile DevelopmentNJCSObjective-C Runtime
0 likes · 10 min read
Dynamic Feature Deployment for iOS Apps: NJCS Architecture and Implementation
Meituan Technology Team
Meituan Technology Team
Sep 26, 2019 · Mobile Development

Beeshell 2.0: Design, Architecture, and Customization of a React Native Component Library

Beeshell 2.0, Meituan’s open‑source React Native component library, adds 38 functions across 33 components and 5 tools, employs a four‑layer architecture with a customizable hierarchy of theme variables to render props, ensures UI consistency via a shared design system, achieves over 80 % test coverage, and plans to grow to 100 + components while welcoming community contributions.

BeeshellComponent LibraryMobile Development
0 likes · 27 min read
Beeshell 2.0: Design, Architecture, and Customization of a React Native Component Library
Didi Tech
Didi Tech
Sep 13, 2019 · Mobile Development

How React Native Link Command Works and Implementation in mand-mobile-rn

The article details the inner workings of the react-native link command and the rnpm system, illustrates the process with react-native-code-push, and explains how mand-mobile-rn links three custom Android modules by using postlink scripts, applyPatch.js, natives.json, and the required Gradle and package registrations.

Android DevelopmentModule LinkingNative Modules
0 likes · 8 min read
How React Native Link Command Works and Implementation in mand-mobile-rn
Didi Tech
Didi Tech
Aug 9, 2019 · Mobile Development

Understanding Hermes Engine: Features, Advantages, and Performance Evaluation in React Native

Hermes is a lightweight, ahead‑of‑time compiled JavaScript engine bundled with React‑Native for Android that shrinks APK size by about 10 %, cuts memory usage, speeds up startup by roughly 16 %, supports ES6, integrates with existing projects and CodePush, and offers improved debugging despite lacking JIT.

HermesMobile DevelopmentReact Native
0 likes · 8 min read
Understanding Hermes Engine: Features, Advantages, and Performance Evaluation in React Native
GF Securities FinTech
GF Securities FinTech
Aug 1, 2019 · Mobile Development

How to Upgrade React Native to 0.59.10 for 64‑Bit Support

This guide explains why Google’s 64‑bit requirement forces a React Native upgrade, outlines the benefits of moving to version 0.59.10, and provides step‑by‑step instructions for updating iOS, Android, Babel configuration, native modules, and handling deprecated components and API changes.

64-bitAndroidXHooks
0 likes · 10 min read
How to Upgrade React Native to 0.59.10 for 64‑Bit Support
Qunar Tech Salon
Qunar Tech Salon
Jun 28, 2019 · Frontend Development

Interview with Meng Chao on Front‑end Cross‑Platform Technologies and Performance Optimization at GMTC

In this interview, Qunar’s front‑end lead Meng Chao shares his experiences with hybrid and QRN frameworks, discusses the GMTC conference, and explains how the company’s no‑instrumentation monitoring and performance‑optimization practices have driven large‑scale front‑end transformation and future cross‑platform opportunities.

Cross-PlatformGMTCHybrid
0 likes · 10 min read
Interview with Meng Chao on Front‑end Cross‑Platform Technologies and Performance Optimization at GMTC
Ctrip Technology
Ctrip Technology
May 27, 2019 · Mobile Development

Leveraging JavaScriptCore for Lightweight Native iOS UI Bridging with JavaScript

Facing iOS App Store review delays, the article explores a lightweight approach that combines native iOS UI with JavaScript via JavaScriptCore, detailing JSContext and JSValue usage, code examples for UI components, and the conversion process that enables dynamic, low‑overhead UI updates without heavy frameworks.

React NativeUIiOS
0 likes · 11 min read
Leveraging JavaScriptCore for Lightweight Native iOS UI Bridging with JavaScript
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 6, 2019 · Mobile Development

How We Doubled React Native First‑Screen Speed in Tencent’s Penguin Tutoring App

This article details the migration of Tencent's Penguin Tutoring app from the Plato framework to React Native, outlines first‑screen performance bottlenecks, presents caching and rendering optimizations, redesigns the carousel component to eliminate flicker, and shares a collection of RN pitfalls and their solutions.

AndroidCarouselMobile Development
0 likes · 16 min read
How We Doubled React Native First‑Screen Speed in Tencent’s Penguin Tutoring App
Ctrip Technology
Ctrip Technology
Apr 11, 2019 · Mobile Development

Ctrip’s Open‑Source React Native Framework CRN: Architecture, Performance Optimizations, and Integration Guide

The article introduces Ctrip’s internally used React Native framework CRN, explains its background, performance‑focused architectural simplifications, open‑source contents such as CLI and Runtime, applicable scenarios for pure and hybrid apps, and provides step‑by‑step instructions for integrating CRN into existing or new mobile projects.

CLIPerformance OptimizationReact Native
0 likes · 11 min read
Ctrip’s Open‑Source React Native Framework CRN: Architecture, Performance Optimizations, and Integration Guide
Ctrip Technology
Ctrip Technology
Jan 7, 2019 · Mobile Development

CRN Framework: Optimizing React Native Performance and Stability at Ctrip

At Ctrip, the CRN framework extends React Native with custom tooling, performance optimizations, modular bundling, lazy loading, preloading, and comprehensive release and monitoring systems, enabling widespread production use across dozens of RN bundles, reducing first‑screen load times by up to 45% and improving stability.

CtripPerformance OptimizationReact Native
0 likes · 27 min read
CRN Framework: Optimizing React Native Performance and Stability at Ctrip
JD Tech
JD Tech
Dec 24, 2018 · Mobile Development

Introducing ARES Cross‑Platform Mobile Development Solution and Mini‑Program Conversion Tool

The article presents ARES, JD.com's cross‑platform mobile application framework comprising Engines, Websites, Studio, Store, and Console, and details its mini‑program conversion tool that bridges ARES Engines with WeChat mini‑programs through command‑line usage, AST manipulation, runtime integration, component alignment, third‑party library support, routing, animation, and conversion constraints.

ASTJavaScriptReact Native
0 likes · 13 min read
Introducing ARES Cross‑Platform Mobile Development Solution and Mini‑Program Conversion Tool
21CTO
21CTO
Nov 3, 2018 · Mobile Development

Why Facebook Is Overhauling React Native: Architecture, Goals, and Roadmap

This article explains how React Native has become the leading cross‑platform mobile framework, details its current use at Facebook, outlines architectural challenges, and describes the major refactoring effort announced by Sophie Alpert to make the framework lighter, more flexible, and better integrated with native code.

Cross-PlatformFacebookReact Native
0 likes · 9 min read
Why Facebook Is Overhauling React Native: Architecture, Goals, and Roadmap
21CTO
21CTO
Oct 4, 2018 · Mobile Development

Why React Native Dominates Mobile Development: 7 Key Advantages Explained

This article examines the current state of React Native, explains why it’s popular among web and mobile developers, and outlines seven fundamental reasons—including cross‑platform code sharing, hot reload, and native performance—that make it a top choice for building iOS, Android, and Windows apps.

App DevelopmentCross-PlatformMobile Development
0 likes · 6 min read
Why React Native Dominates Mobile Development: 7 Key Advantages Explained
Meituan Technology Team
Meituan Technology Team
Sep 27, 2018 · Mobile Development

Beeshell: An Open-Source React Native Component Library for Mobile Apps

Beeshell is an open‑source React Native component library offering a comprehensive, customizable set of JavaScript and native UI components for iOS, Android, and web, featuring layered architecture, extensive documentation, testing, and a roadmap to expand beyond 100 components.

Component LibraryCross-PlatformMobile Development
0 likes · 25 min read
Beeshell: An Open-Source React Native Component Library for Mobile Apps
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Sep 11, 2018 · Mobile Development

Cross‑Platform Native Fusion: Expert Insights from IMWeb Conf 2018

The IMWeb Conf 2018 Native Cross‑Platform Fusion session explored the challenges of “write once, run anywhere,” presented expert talks on frameworks like Taro, Hippy, and Weex, and featured a detailed Q&A on React Native, JSBridge optimization, and choosing sustainable mobile development solutions.

Cross-PlatformHippyJSBridge
0 likes · 12 min read
Cross‑Platform Native Fusion: Expert Insights from IMWeb Conf 2018
Xianyu Technology
Xianyu Technology
Sep 10, 2018 · Mobile Development

Performance Comparison of Flutter vs React Native on iOS and Android

The Xianyu team rewrote a product detail page in Flutter, benchmarked it against native and React Native implementations on iPhone 5c, iPhone 6s, Xiaomi 2s and Samsung S8, and found Flutter consistently matched or outperformed native on iOS and surpassed React Native on both platforms in FPS, CPU usage and memory stability, earning it a gold‑medal rating.

Cross-PlatformFlutterMobile Development
0 likes · 8 min read
Performance Comparison of Flutter vs React Native on iOS and Android
Tongcheng Travel Technology Center
Tongcheng Travel Technology Center
Aug 10, 2018 · Mobile Development

From Vue to React Native: A Complete Guide to Building a Delivery App on Android

This article shares a step‑by‑step experience of migrating a Vue‑based project to React Native for an Android delivery‑chain app, covering environment setup, debugging, common pitfalls, routing, state management, storage, hot updates, and practical code snippets to help newcomers get started quickly.

AndroidMobile DevelopmentReact Native
0 likes · 9 min read
From Vue to React Native: A Complete Guide to Building a Delivery App on Android
Qunar Tech Salon
Qunar Tech Salon
Aug 3, 2018 · Mobile Development

Deep Dive into React Native setNativeProps: Understanding the Implementation and Source Code

This article explains when and why to use React Native's setNativeProps, walks through a practical example, and thoroughly examines the underlying source code—including NativeMethodsMixin, View component inheritance, and the UIManager.updateView implementation—to help developers grasp its performance benefits and internal workings.

Mobile DevelopmentNativeMethodsMixinReact Native
0 likes · 11 min read
Deep Dive into React Native setNativeProps: Understanding the Implementation and Source Code
Meituan Technology Team
Meituan Technology Team
Aug 2, 2018 · Mobile Development

Using Jenkins Pipeline for Multi‑Project Android Build Automation

The team replaced numerous free‑style Jenkins jobs with a single Pipeline‑as‑code project that pulls a shared script from SCM, uses UI parameters and project‑specific configs to run a standardized Android build flow—including React Native bundle download—providing versioned, maintainable, and visualized multi‑project CI.

AndroidCI/CDJenkins
0 likes · 18 min read
Using Jenkins Pipeline for Multi‑Project Android Build Automation
Yuewen Frontend Team
Yuewen Frontend Team
Aug 1, 2018 · Mobile Development

Key Lessons from Building a Large‑Scale React Native App

This article shares the Yueqi Reading team's three‑month journey of building a large‑scale React Native app, covering business background, technology selection, navigation management, state persistence, performance tuning, release automation, error monitoring, common pitfalls, and practical tips for mobile developers.

CodePushNavigationPerformance Optimization
0 likes · 29 min read
Key Lessons from Building a Large‑Scale React Native App
Qunar Tech Salon
Qunar Tech Salon
Jul 11, 2018 · Mobile Development

Evolution of Native Mobile Development and Heterogeneous Solutions: From Small Apps to Dynamic Components and Cross‑Platform Frameworks

The article reviews the history of native Android development, describes the shift from small‑app architectures to static and dynamic componentization, examines hybrid and cross‑platform solutions such as WebView‑based, script‑DSL, and independent runtimes, and outlines future trends and strategic choices for mobile teams.

ComponentizationCross-PlatformNative
0 likes · 12 min read
Evolution of Native Mobile Development and Heterogeneous Solutions: From Small Apps to Dynamic Components and Cross‑Platform Frameworks
21CTO
21CTO
Jun 22, 2018 · Mobile Development

Why Airbnb Abandoned React Native and What It Means for Mobile Development

This roundup highlights Google’s refreshed account management UI, Firefox’s renewed focus on privacy, and Airbnb’s decision to drop React Native in favor of native apps, outlining the technical and organizational challenges that drove the shift and its broader implications for mobile developers.

AirbnbCross-PlatformGoogle Account
0 likes · 7 min read
Why Airbnb Abandoned React Native and What It Means for Mobile Development
Qunar Tech Salon
Qunar Tech Salon
May 31, 2018 · Mobile Development

Performance Monitoring and Optimization for React Native Applications at Qunar

This article describes Qunar's approach to quantifying, automatically detecting, and optimizing performance issues in React Native mobile apps by defining measurable metrics, real‑time data sampling, automated analysis rules, and visual feedback to enable proactive APM during development and testing.

APMMetricsMobile Development
0 likes · 9 min read
Performance Monitoring and Optimization for React Native Applications at Qunar
Ctrip Technology
Ctrip Technology
Apr 23, 2018 · Mobile Development

CRNWEB Framework: Design, Architecture, and Implementation for Cross‑Platform Mobile and Web Development

The article introduces CRNWEB, a cross‑platform framework built on React‑Native that unifies iOS, Android, and Web development by detailing its design goals, component system, style handling, event processing, and packaging optimizations to achieve high performance and consistent user experience.

CRNWEBMobile FrameworkPerformance Optimization
0 likes · 12 min read
CRNWEB Framework: Design, Architecture, and Implementation for Cross‑Platform Mobile and Web Development
Qunar Tech Salon
Qunar Tech Salon
Jan 19, 2018 · Frontend Development

Thoughtful Middle‑Platform: Technical Cultivation for Frontend Teams

The article reflects on the evolution of frontend engineering, emphasizing team growth, pragmatic management, and the role of a middle‑platform in delivering stable, service‑oriented solutions, while sharing insights from Alibaba D2 about balancing innovation with practical business needs.

React Nativeteam managementtechnical cultivation
0 likes · 11 min read
Thoughtful Middle‑Platform: Technical Cultivation for Frontend Teams
Hujiang Technology
Hujiang Technology
Jan 18, 2018 · Mobile Development

Understanding Network Requests in React Native: APIs, Debugging Techniques, and Binary Data Transfer

This article explains how React Native handles network requests differently from web browsers, describes the built‑in fetch, XMLHttpRequest, and WebSocket APIs, outlines debugging methods using proxies, Reactotron, and Chrome DevTools, and discusses strategies for sending binary data such as Base64 encoding and WebSocket support.

Mobile DevelopmentNetwork RequestsReact Native
0 likes · 10 min read
Understanding Network Requests in React Native: APIs, Debugging Techniques, and Binary Data Transfer
Tencent Music Tech Team
Tencent Music Tech Team
Oct 20, 2017 · Frontend Development

Integrating React‑Native Components into Web with React‑Web: Practices, Issues, and Optimizations

The article describes how to reuse React‑Native code on the web with react‑web by mapping components during bundling, handling platform‑specific layout and flexbox differences, and applying optimizations such as server‑side rendering, on‑demand imports, Preact substitution, and CSS extraction, which together cut bundle size by up to 70 % and halve first‑paint time.

Performance OptimizationPreactReact Native
0 likes · 12 min read
Integrating React‑Native Components into Web with React‑Web: Practices, Issues, and Optimizations
Ctrip Technology
Ctrip Technology
Sep 11, 2017 · Mobile Development

Ctrip’s Mobile Engineering Practices: React Native, Wireless Network Service Architecture, and Android Plugin Refactoring

The article recounts Ctrip’s 2017 EGO event where senior engineers shared practical experiences on scaling React Native in their app, detailed the company’s TCP‑based wireless network service architecture, and presented Android plugin refactoring techniques, highlighting technical challenges, solutions, and future directions.

Android PluginCtripReact Native
0 likes · 7 min read
Ctrip’s Mobile Engineering Practices: React Native, Wireless Network Service Architecture, and Android Plugin Refactoring
JD Retail Technology
JD Retail Technology
Sep 4, 2017 · Mobile Development

JDReact Three‑Platform Integration: Architecture, Optimization, and Practices for React Native at JD.com

This article details JD.com's three‑platform JDReact solution built on React Native, describing the original mobile development pain points, RN's benefits and limitations, the customized architecture, performance and memory optimizations, gray‑release and fallback mechanisms, CI/CD workflow, and monitoring practices that enable stable cross‑platform app delivery.

Cross-PlatformJDReactMobile Development
0 likes · 20 min read
JDReact Three‑Platform Integration: Architecture, Optimization, and Practices for React Native at JD.com
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 7, 2017 · Mobile Development

Avoid These 11 Common Mistakes When Building React Native Apps

After a year of developing with React Native, this guide shares eleven frequent pitfalls—from misguided project planning and layout handling to Redux store design, component structuring, inline styling, and gesture handling—offering practical advice to help developers build more robust mobile applications.

LayoutReact NativeRedux
0 likes · 12 min read
Avoid These 11 Common Mistakes When Building React Native Apps
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 4, 2017 · Mobile Development

How React Native Bridges JavaScript and Objective‑C: A Step‑by‑Step Guide

This article explains how React Native leverages iOS’s JavaScriptCore to enable seamless JavaScript‑to‑Objective‑C communication, covering module registration, callback handling, event listening with NativeAppEventEmitter, building native UI components, the module configuration table, and the detailed call flow between JS and native code.

JS-OC BridgeMobile DevelopmentNative Modules
0 likes · 6 min read
How React Native Bridges JavaScript and Objective‑C: A Step‑by‑Step Guide
ITPUB
ITPUB
Mar 18, 2017 · Frontend Development

From NodeJS Backend to Large-Scale React Native: Our ‘Big Wireless’ Team Reorg Explained

The article recounts a recent team restructuring that shifted NodeJS from pure backend development to a broader "big wireless" strategy, introduced large‑scale React Native adoption, created a dedicated architecture group, and shares practical lessons on aligning technology choices with business value.

React NativeTeam Structurearchitecture
0 likes · 16 min read
From NodeJS Backend to Large-Scale React Native: Our ‘Big Wireless’ Team Reorg Explained
Aotu Lab
Aotu Lab
Mar 3, 2017 · Mobile Development

Building LightOxygen Android v1.0 with React Native: Key Lessons

The article recounts how a team of mostly iOS developers built the LightOxygen Android v1.0 app using React Native, detailing their version planning, feature set, React Native’s strengths and shortcomings, and future roadmap while sharing practical development insights.

AgileAndroidApp Release
0 likes · 7 min read
Building LightOxygen Android v1.0 with React Native: Key Lessons
Hujiang Technology
Hujiang Technology
Feb 10, 2017 · Mobile Development

Thinking in Redux: Migrating from MVC to React‑Native State Management

This article explains how to transition from traditional MVC architecture to Redux when building a React‑Native mobile app, detailing the analogies between actions, reducers, stores, and components, and provides step‑by‑step code examples for implementing state management in JavaScript.

JavaScriptMobile DevelopmentReact Native
0 likes · 10 min read
Thinking in Redux: Migrating from MVC to React‑Native State Management
Tencent Cloud Developer
Tencent Cloud Developer
Jan 25, 2017 · Frontend Development

Understanding React: Component Architecture, Props, State, Lifecycle, Server‑Side Rendering, and React‑Native

Zuo Ming explains React’s component architecture—props, state, lifecycle methods, server‑side rendering, and React‑Native—using a bamboo water‑wheel analogy, demonstrating prop validation, state updates, lifecycle phases, SSR hydration, cross‑platform code reuse, and unit testing to give front‑end engineers a complete practical foundation.

PropsReActReact Native
0 likes · 12 min read
Understanding React: Component Architecture, Props, State, Lifecycle, Server‑Side Rendering, and React‑Native
Qunar Tech Salon
Qunar Tech Salon
Jan 19, 2017 · Mobile Development

Optimizing First‑Screen Loading in Qunar React Native (QRN) Framework

This article explains the RN and QRN loading processes, analyzes the causes of long white‑screen times, and presents practical techniques such as JS bundle splitting, Bridge pre‑loading, lazy requires, and asynchronous component registration to significantly reduce QRN first‑screen loading latency.

Lazy RequireMobile DevelopmentQRN
0 likes · 16 min read
Optimizing First‑Screen Loading in Qunar React Native (QRN) Framework
Qunar Tech Salon
Qunar Tech Salon
Jan 18, 2017 · Mobile Development

Performance Optimization Practices for React Native ListView in Qunar's QRN

The article details Qunar's large‑scale adoption of React Native, analyzes the performance shortcomings of the standard RN ListView, and presents the QRN ListView and QRN InfiniteListView optimizations that improve scrolling smoothness, memory usage, and fixed‑height row handling on mobile devices.

ListViewMobile DevelopmentOptimization
0 likes · 8 min read
Performance Optimization Practices for React Native ListView in Qunar's QRN
Hujiang Technology
Hujiang Technology
Jan 18, 2017 · Mobile Development

React Native vs ReactJS: Installation, Styling, Navigation, Animation, and Platform‑Specific Development

This article compares React Native and ReactJS, covering installation, packaging, component mapping, styling differences, Flexbox usage, animation APIs, gesture handling, navigation options, platform‑specific code organization, developer tools, and publishing considerations for building cross‑platform mobile apps.

Mobile AppNavigationReact Native
0 likes · 11 min read
React Native vs ReactJS: Installation, Styling, Navigation, Animation, and Platform‑Specific Development
Qunar Tech Salon
Qunar Tech Salon
Dec 14, 2016 · Mobile Development

Cross‑Platform ListView Performance Optimization in React Native and Weex

This talk explains how Qunar’s engineering team analyzed the performance bottlenecks of React Native’s ListView, compared it with native UITableView and Weex implementations, and proposed JavaScript‑based reuse logic and native bridge solutions to improve scrolling efficiency across iOS and Android.

AndroidCross‑PlatformListView
0 likes · 18 min read
Cross‑Platform ListView Performance Optimization in React Native and Weex
Tencent TDS Service
Tencent TDS Service
Dec 8, 2016 · Mobile Development

How Qunar Optimized React Native ListView Performance Across Platforms

This article details Qunar's experience optimizing React Native ListView performance, covering RN's internal implementation, identified bottlenecks, and two practical solutions—JavaScript‑based cell reuse and a native UITableView bridge—while also comparing RN with Weex and discussing cross‑platform considerations.

Cross-PlatformListViewPerformance Optimization
0 likes · 20 min read
How Qunar Optimized React Native ListView Performance Across Platforms
Ctrip Technology
Ctrip Technology
Nov 9, 2016 · Mobile Development

Introducing and Optimizing React Native at Ctrip: Challenges, Solutions, and Future Plans

This article details Ctrip's adoption of React Native, explaining why it was introduced, the framework and tooling built around it, the performance and stability problems encountered, the various bundle‑splitting and engine‑caching solutions applied, and the roadmap for further cross‑platform enhancements.

Bundle SplittingCrash HandlingMobile Development
0 likes · 18 min read
Introducing and Optimizing React Native at Ctrip: Challenges, Solutions, and Future Plans
Ctrip Technology
Ctrip Technology
Nov 9, 2016 · Mobile Development

Applying React Native in Ctrip Train Ticket Product: Practices, Challenges, and Solutions

This article shares Ctrip's experience of adopting React Native for its train ticket business, covering why RN was chosen, its current state, the Ctrip RN framework, practical implementation details, encountered pitfalls, and various optimization techniques to achieve near‑native performance and rapid iteration.

AndroidCross-PlatformCtrip
0 likes · 12 min read
Applying React Native in Ctrip Train Ticket Product: Practices, Challenges, and Solutions
Qunar Tech Salon
Qunar Tech Salon
Oct 28, 2016 · Frontend Development

React Web: Enabling Write‑Once Run‑Anywhere for React Native Applications

The article introduces React Web, a framework that extends React Native components and APIs to the browser, allowing a single codebase to run unchanged on iOS, Android, and web, thereby improving development efficiency, reducing costs, and addressing performance and compatibility challenges.

Cross-PlatformReact NativeWeb Development
0 likes · 5 min read
React Web: Enabling Write‑Once Run‑Anywhere for React Native Applications
21CTO
21CTO
Oct 23, 2016 · Mobile Development

How WeChat Mini Programs Are Shaping the Future of Mobile App Development

This article explores the evolution of WeChat Mini Programs, tracing their roots from early web app technologies like Java Applets and Flash to modern React‑Native‑based development, and discusses their potential impact on users, enterprises, and independent software vendors.

Mobile DevelopmentReact Nativemini-programs
0 likes · 11 min read
How WeChat Mini Programs Are Shaping the Future of Mobile App Development
Ctrip Technology
Ctrip Technology
Aug 19, 2016 · Mobile Development

Refactoring a Hotel Page in React Native: Architecture, Redux, and Native Animation Lessons

This article shares the experience of a Qunar hotel team refactoring their hotel homepage with React Native, detailing the initial native‑style approach, challenges with Redux, robustness and animation performance, and the subsequent architectural redesign that improved maintainability and user experience.

Mobile DevelopmentNative AnimationReact Native
0 likes · 17 min read
Refactoring a Hotel Page in React Native: Architecture, Redux, and Native Animation Lessons
Qunar Tech Salon
Qunar Tech Salon
Aug 11, 2016 · Mobile Development

Refactoring Qunar's Hotel Page with React Native: Challenges, Solutions, and Lessons Learned

This article recounts the Qunar hotel team's experience refactoring a hotel page using React Native, detailing the initial native‑mindset pitfalls, robustness and animation issues, and how adopting a more React‑centric architecture with Redux, connect, and native animation APIs dramatically improved performance, maintainability, and developer experience.

Mobile DevelopmentReact NativeRedux
0 likes · 18 min read
Refactoring Qunar's Hotel Page with React Native: Challenges, Solutions, and Lessons Learned
Tencent TDS Service
Tencent TDS Service
Jul 7, 2016 · Mobile Development

Scaling React Native at Tencent: Performance Wins and Lessons Learned

During a Dev Club session, Tencent engineers shared a comprehensive review of their React Native adoption, covering project history, architecture, version management, performance optimization, crash analysis, and practical tips for mobile developers seeking to balance native quality with cross‑platform efficiency.

AndroidCross‑PlatformPerformance Optimization
0 likes · 19 min read
Scaling React Native at Tencent: Performance Wins and Lessons Learned
Tencent TDS Service
Tencent TDS Service
Mar 10, 2016 · Mobile Development

How React Native Bridges Java and JavaScript on Android: A Deep Dive

This article provides a comprehensive source‑code analysis of React Native's Java↔JavaScript communication mechanism on Android, detailing module registration, the Java‑to‑JS and JS‑to‑Java call flows, and the underlying native bridge implementation.

AndroidJavaScript BridgeMessageQueue
0 likes · 14 min read
How React Native Bridges Java and JavaScript on Android: A Deep Dive
21CTO
21CTO
Jan 7, 2016 · Mobile Development

How Ele.me Scaled Its Mobile App Architecture: From MVC to Hybrid EMC & Hot Patch

This article traces Ele.me's mobile app evolution, detailing the shift from a simple MVC structure to a decoupled module system, the EMC hybrid architecture, and finally a React‑Native plus Hot‑Patch strategy that balances rapid iteration with high stability for billions of users.

App ArchitectureHybrid AppMVC
0 likes · 10 min read
How Ele.me Scaled Its Mobile App Architecture: From MVC to Hybrid EMC & Hot Patch
Architect
Architect
Dec 16, 2015 · Mobile Development

React Native: Technical Background, Planning, and Risks Overview

This article provides a comprehensive overview of React Native, covering its motivation and design principles, the recent migration of Alibaba’s iPad “Guess You Like” feature, detailed planning for integration, and potential risks such as platform support, performance, and App Store policies.

Cross-PlatformMobile DevelopmentReact Native
0 likes · 8 min read
React Native: Technical Background, Planning, and Risks Overview
ITPUB
ITPUB
Nov 18, 2015 · Frontend Development

Why Do US and China HTML5 Front‑End Markets Evolve So Differently?

The article compares the mature, innovation‑focused US HTML5 ecosystem with China’s still‑hype‑driven market, highlighting differences in developer attitudes toward WebGL, WebSocket, React JS/Native, cross‑platform packaging, and the shift from buzzwords to practical, deep‑tech solutions.

HTML5Market AnalysisReact Native
0 likes · 8 min read
Why Do US and China HTML5 Front‑End Markets Evolve So Differently?
21CTO
21CTO
Oct 24, 2015 · Mobile Development

How to Deploy New Features in iOS Apps Without Releasing a New Version

This article reviews the various dynamic deployment techniques for iOS apps—Web App, Hybrid App, React‑Native, Lua/Javascript patches, and JSON‑described views—analyzes their pros and cons, and proposes a JSBridge‑based microservice architecture as the most practical solution.

HybridJSBridgeJSPatch
0 likes · 18 min read
How to Deploy New Features in iOS Apps Without Releasing a New Version
Qunar Tech Salon
Qunar Tech Salon
May 18, 2015 · Mobile Development

Analysis of Cross‑Platform Mobile Development Approaches

The article reviews recent cross‑platform mobile development techniques—including Web‑based hybrid, code‑conversion, compilation, and virtual‑machine streams—examining their performance, functionality limitations, and practical tools such as j2objc, MyAppConverter, Sharpen, Haxe, and XMLVM.

Code ConversionCross-PlatformHybrid
0 likes · 12 min read
Analysis of Cross‑Platform Mobile Development Approaches