Sentry 的 RN 埋點分為兩種伤柄，React Native 分為兩種：
兩者的區(qū)別是 react-native-sentry 需要 native 的協(xié)助，需要安裝對應(yīng)的客戶端依賴，能夠更好的捕獲RN導(dǎo)致的崩潰錯誤斤斧。raven.js 是純 js 的上報鳄虱，純 js 的上報只能說夠用办成，不能定位到源碼的情況赦政，但是從接口情況，以及頁面breadcrumb泳叠，也能夠大概定位到bug的位置作瞄。
對比 react-native-sentry 和 raven.js
react-native-sentry 的缺點
- 打包會涉及 source-map，體積會變大危纫，不符合熱更新的需求宗挥。
- 判斷機型方面，ios 和 android 情況不太一樣种蝶。安卓功能受限契耿，價值不大。
采用 raven.js 有一定道理螃征，夠用搪桂，把 crash 的情況收集交給 native。如今市面上基本上都是混合 app盯滚，并不是純 RN 應(yīng)用踢械。如果錯誤的收集讓 App 的體積變大，顯然有點不合適魄藕。
如果是純RN應(yīng)用内列，expo則會自帶react-native-sentry。
raven.js 的缺點
官方已經(jīng)廢棄泼疑，考慮到sentry-javascript源碼有AsyncStorage德绿，而且該 api 會在 RN 后續(xù)版本0.59中廢棄。所以如果日后 RN 版本升級后退渗，考慮錯誤上報的公共代碼修改是必要的移稳。建議如果60以后的RN版本建議更換成為sentry-react-native。
錯誤類型
錯誤的類型分為兩種：
- 渲染報錯
- JS 端報錯
渲染報錯是由 react 機制內(nèi)控制会油，錯誤的信息會觸發(fā)生命周期getDerivedStateFromError, 所以在周期回收錯誤信息即可Raven.captureException(error)个粱，參考React Error Boundaries。
class ErrorBoundary extends React.Component {
constructor(props) {
super(props);
this.state = { hasError: false };
}
static getDerivedStateFromError(error) {
Raven.captureException(error);
return { hasError: true };
}
componentDidCatch(error, errorInfo) {
// 嘗試過翻翩，但是并沒有在RN59觸發(fā)
}
render() {
if (this.state.hasError) {
return <h1>Something went wrong.</h1>;
}
return this.props.children;
}
}
JS 端報錯是在 react 機制外控制都许，需要調(diào)用Raven的 react-native plugin。原理是通過 react native 的官方 apiErrorUtils捕獲 JS 端的“紅屏”錯誤嫂冻，詳情請參考sentry-javascript胶征。使用方法如下：
var Raven = require('raven-js');
Raven.addPlugin(require('raven-js/plugins/react-native'));
做了這兩部操作基本完成了RN的代碼邏輯層的錯誤上報。
相關(guān)信息
在項目初始化的時候桨仿，Raven.setUserContext(params)會自動將用戶 App 相關(guān)信息回收睛低，有利于線上問題的判斷，大家可以結(jié)合自己App的用戶數(shù)據(jù)進行處理服傍。 而Raven.captureBreadcrumb是關(guān)鍵的錯誤信息點钱雷。關(guān)鍵錯誤信息點的流程有助于錯誤流程的區(qū)分。
