【0.47】React Native 中文更新日誌

Marno發表於2017-08-21

原文網址 : https://juejin.im/post/599a4450f265da247157ea10

本文為 Marno 原創，轉載必須保留出處！

公眾號【 Marno 】，關注後回覆 RN 加入交流群

React Native 優秀開源專案大全：www.marno.cn

一、導讀

這次更新翻譯的慢了一點，因為最近事情比較多，希望大家諒解，畢竟我都是在用業餘時間做這些。如果想第一時間獲取 RN 中文更新日誌，也可以關注我的公眾號。

言歸正傳，這次更新最多的內容就是分包的變化，對效能的優化比較小，因為原理就是那樣，無論在怎麼優化都不可能突破原生和 JS 之間這道障礙，不過經過這幾次不斷的分包，程式碼結構看起來更清晰了，而且隨著功能越來越大，也需要這樣的方式去優化管理。

這次更新在 Android 增加了對 Kotlin 模組的 link 功能，算是對上次更新遺留問題的彌補，這也說明一個問題，不管你願不願意， Kotlin 已經被越來越多的人接受了。

對了，順便說一下，仔細的人應該早就發現在 Libraries 包下有一個 Experimental 的包，裡面包含了一些實驗性的元件，包括一些側滑元件，按鈕之類的，感興趣的可以自己下載原始碼看下。但是實驗性元件，你懂的！

PS：更新有風險，嚐鮮需謹慎。個人覺得除非十分必要，否則沒有必要經常更新 RN 版本。

二、通用

2.1 重大變化

移除不再使用的 createJSModules 方法（Android）

現在不用特意宣告要提供哪個 JS 模組給 native 了，所以將 createJSModule 方法徹底移除了，但是仍可以按照之前的方式來呼叫 JS 模組。
修正字型 weight 屬性的（iOS）

之前設定 weight 的屬性值為 “300”或者 “200” ，經過計算後都會按照 Roboto-Thin 樣式來處理，這導致這兩個值呈現的效果一樣，現在已經將這一問題修復。

2.2 修復 Bug

VirtualizedList: 修復由於過早呼叫 _updateCellsToRender 方法帶來的問題
VirtualizedList: 優化渲染時間計算方式
VirtualizedList: 修復當沒有設定 getItemLayout 方法時引起的渲染問題
CLI: Fix broken default getProjectRoots
修復類檔案中宣告證照的註釋格式（之前只多了個【*號】）
Fix deepFreezeAndThrowOnMutationInDev-test for Node v8.1.0
修復 invariant 的引用路徑
Fix configure glog script when building from xcodebuild
修復在 Geolocation.js 中呼叫 warning 方法時缺少第一個引數導致的錯誤

2.3 新特性

在官網的側邊選單中的 Guides 分類下新增一欄：Components and APIs（改版快主要是將現有元件和 API 進行了分類整理）
新增 marker 來標記整個 native 模組建立的過程
在官網側邊選單 Guides 下 Images 中新增關於自定義 require 型別的文件介紹
向 RN CLI 服務端新增 https 選項
使 VirtualizedList 支援同一方向的巢狀滾動。
Add --maxWorkers flag and allow transformers to run in-band
FlatList: 在 Dev 模式下增加對 getItemLayout 返回物件的屬性數量的校驗，便於我們在開發時能快速定位由於物件缺少屬性導致的問題
FlatList: 新增 setNativeProps 方法，可以直接對 native 屬性進行設定
當同時設定了 pagingEnabled 和 snapToInterval 屬性時會報警告
為 SwipeableRow 元件（實驗性元件）新增了 close 方法
新增一個新的 babel 轉換器用於 inlining regenerator-runtime per file
將 Wix.com 新增到官網的 showcase 中
移除 react-native/packager 資料夾

因為 RN 更換了新的打包工具 metro-bundler，這個工具是 FB 專門為 RN 設計的 JS 打包機，據說比之前用的 packager 更快了，感興趣的可以到 github 看下，網址：github.com/facebook/me…
Docs：更新了官網中側邊選單 The Basics 板塊中 Handling Touches 下的教程，更便於初學者理解 RN 的 Touch 時間。
Docs: 修改了官網側邊選單一些模組的排序
在儘可能多的地方預設禁用 auto-mock
從 local-cli 中移除 worker
Promise support for C++ bridge
給 VirtualizedList 和 FlatList 新增 progressViewOffset 方法，目的為了正確的顯示上拉載入動畫
Implement Systrace integration for Fiber
新增判斷 global.performance 確實為空時才進行覆蓋
將關於 uglify 和 babel 的型別定義從 React Native 中移到了 Metro Bundler 中
清理 local-cli/core/tests
修復在 Node v8 時使用 mock-fs 造成的問題
修改了之前更新時沒有修改到的一些 PropTypes 的引用

記得很多人下載一些開源的專案，執行時會提示 PropTypes 找不到，因為 FB 將 PropTypes 移到了另一個包，所以會找不到，看下之前的更新日誌裡有提到過的。
改進，這是上次更新新增的元件，如果不清楚怎麼使用，可以看下上次的更新日誌。
移除了 retainLines 和 sourceMaps 選項
將 jest、jest-repl、jest-runtime 版本更新到 20.0.4
更新 guidelines
將 preset 變成一個函式來處理不同的開發者設定
將 Native Animated 中 x.makeNative 的呼叫調到 super.makeNative 之前
修改語法，使用 'its' 代替 'it's'
Yoga: 如果使用了 flex，那麼其總和最小為 1
Yoga: 當設定了 display:none 時，停止渲染子節點
Yoga: 在 display 屬性中新增 flex 和 none 的屬性值
ImageBackground: 用 StyleSheet 中快取的樣式代替直接在 style 中設定屬性物件，以提高渲染效能。
在文件中新增內容，說明在 Android 上暫不支援keyboardWillShow 和keyboardWillHide 屬性。
給 debugger.html 新增音訊，以保持在 Chrome 中除錯 RN 應用時 tab 的優先順序
在 react-native 中提供方法獲取 unstable_batchedUpdates
當設定了 sticky headers 時禁用子元件 clipping
使用 create-react-class 包中的 createReactClass 取代某些官方元件中的 React.createClass
控制 Metro 是否呼叫 Babel 去查詢 .babelrc 檔案
停止在 JSTimers 使用 Map
將 JSTimersExecution 合併到 JSTimers，並刪除對 JSTimersExecution 的引用。
允許無參的 rejection 回撥
修復 TextInputState 類中 blurTextInput() 方法註釋中的錯別字
重構了 Button.js 中的程式碼，使邏輯更清晰
設定 bridge 可以為共享：允許 native 模組在 init 後再註冊
使用 prop-types 包中的 PropTypes 代替 react 中的 PropTypes
將 Executor 重新命名為 JSExecutor
修改文件中在 Windows 安裝開發環境的 choco 命令（縮短語法）
像 app component 新增一個可選的 wrapper component
Jest Mocks for NetInfo and Linking
在 Yoga 中檢測元件是否溢位

三、Android

修復 Bug

修復 ReactArt 中的繪製弧線計算的問題
修復當沒有獲取到 Window 許可權時程式奔潰的問題
修復 dev 載入指示器
修復 ReactInstanceManager.java 中的 package 順序

新特性

在文件中指明 Android 目前不支援 overflow: hidden 屬性
新增 cmd+opt+ctrl+D 命令以便全域性呼叫 dev menu
新增 dev bundle 下載監聽器，方便我們在 bundle 載入的時候可以顯示進度，該功能也主要是為了 Expo 顯示載入進度的。
為 AndroidViewPager 增加 peeking（偷看）功能

很多 App 的 banner 都用這種設計，在 Android 上用 ViewPager 實現比較簡單，現在官方也正式提供這個屬性了。用語言描述的話，大概就是在本頁會露出下一頁的一邊。
在呼叫同步 native 模組時的錯誤資訊中顯示 Java 堆疊資訊
在文件中說明如何從 Android 的 asset 目錄中讀取圖片資源 source={{uri: 'asset:/foo.png'}}
控制檯 link 命令支援編譯用 Kotlin 開發的 Android 模組了
允許新增多個 bridge 監聽器
在 ReactInstanceManager.java 類中增加 log 日誌列印
移除 SetBuilder 這個類
使用非零的例項化的 key 來標記 INITIALIZE_MODULE 標記
只載入一次核心模組
將代理 server 中標識 host 和 port 的常量分離開，之前IP和埠儲存在一個常量中，現在拆分開了。
在 ReactRootView 中呼叫 removeOnGlobalLayoutListener 時先判斷 Android SDK 的版本
將 packages 拆分到 core bridge 和 core RN 中
不再允許 multipart bundle 的傳送
將 getConstants 中的 NativeArray 轉換成 NativeMap

四、iOS