joppot

コピペで絶対動く。説明を妥協しない

プログラミング

React NativeでGoogle Chrome上でのデバッグ時に動作が遅くなる場合の対処

投稿日:2017年1月10日 更新日:


debugthumb

概要

みなさんこんにちはcandleです。
今回はReact NativeのデバッグでChromeを使うと
シミュレーターの動作が遅くなってしまう問題を対処します。

とは言っても簡単で、Google Chromeの代わりにChromiumを使用するだけです。

前提

Reactの開発環境が整っている


Chromiumをインストールする

それでは早速Chromiumをインストールします。
webサイトからもダウンロードできますが
brewを使うと便利です。

brew cask install chromium

caskisntallchromium

インストールが完了しました。

デバッグしてみる

適当なreact-native プロジェクトでまずは起動します。

react-native run-ios

起動したら、シミュレーター上で cmd + d を押します。
メニューが出てくるので、「Debug JS Remotely」を選びます。

enabledebugjsremote

Google Chromeが起動します。

googlechromedebugwihndow

残念ながら、どうやったらデフォルトのブラウザをChromiumにするかわからないので、
まずはGoogle Chromeで起動して、そのURLをコピってChromiumに移す方法をとります。

URLをコピーして、Chromiumを立ち上げます。
コピーしたURLを貼り付けて移動します。

chromeiumdebugwindow

上の写真の様に「Status: Another debugger is already connected」と出てきます。
これはGoogle Chrome側でつないでいるので警告が出てくるのです。

なので、Google Chromeを終了します。

シミュレーター側でエラーがでますが、cmd + Rでリロードしてあげると、
Chromium側につないで正常に動きます。

simulatordebugerror

無事Chromium側につながりました。

chromiumconnectsuccess

まとめ

私の場合はこれでシミュレーターの速度は早くなりました。

スポンサードリンク

「為になったなぁ」と思ったら、シェアお願いします。

-プログラミング
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

fabricのsshのネットワーク設定でパスワードか公開鍵を使って認証する

概要 皆さん今日はcandleです。今回はsshを使ったfabricの設定をしましょう。 一般にsshにはパスワード認証と公開鍵認証があるので、そのどちらも試してみましょう。 もちろんセキュリティ面で …

railsのrakeで作成したmigrationファイルとstatus履歴を削除する

概要 みなさんこんにちはcandleです。今回はrakeコマンドで作成したマイグレーションファイルの管理を紹介します。rakeコマンドを使っていると、よくよく考えれば必要の無いファイルがある。とか重複 …

MAMPのPHPからSQLite3データベースにアクセスして値を取得する

概要 みなさんこんにちはcandleです。MAMPのSQLiteデータベースとテーブルを作成して、レコードも挿入した事なので、値を取得してみましょう。 前提 phpのバージョンが5.3以上である SQ …

javascriptでのJSONの大きさ(サイズ)の取得

概要 みなさんこんにちはcandleです。今回はプログラミングで少し手間取ったJSONサイズ取得の問題について書いていこうと思います。 JSONはjavascirptでわりと多く使われるオブジェクト型 …

reactで最もシンプルなドロップダウンメニューを作成

概要 みなさんこんにちはcandleです。今回はreactで最もシンプルなドロップダウンメニューを作ってみたいと思います。 前提 Reactの知識がある 準備 以下のコマンドでreactプロジェクトを …


ベンチャー企業のCTOをやってます。大学時代にプログラミングを始め、javaから入門し、C++へて、PHPへと進み、会社ではRailsを使用。自動化が大好きなプログラマー