基于移動端真機調(diào)試的圖文教程(分享)
最近要分析web頁面,在安卓和ios上的性能差異,除了操作系統(tǒng)本身不同之外,應該還多地方要探究的,第一步就是要在真機上分析。所以總結(jié)一下幾個方法。
1.Mac+iPhone+ Lightning+Safari 瀏覽器
步驟:
1)用:Lighting線將mac與iphone相連
2)iphone打開Web檢查器(設(shè)置->Safari->高級->Web檢查器)
3)iphone用safari打開要進行分析的頁面
4)mac打開safari瀏覽器(菜單->開發(fā)->對應的手機名稱->要調(diào)試的頁面),點擊即進入Safari Developer Tools
5)可以見到的調(diào)試界面是這樣的
缺點:不能調(diào)試webView里面的頁面
2.安卓手機+安卓數(shù)據(jù)線+電腦
步驟:
1)用數(shù)據(jù)線將手機與電腦相連
2)手機開啟use調(diào)試(安卓不同機型開啟的步驟不盡相同,不知道的百度一下)
3)打開chrome,輸入chrome://inspect/#devices,勾選Discover USB devices
4)用手機chrome打開要調(diào)試的網(wǎng)頁(如果是其他webView頁面,需要在app配置啟動代碼,詳鍵官方教程)
5)選擇你要調(diào)試的頁面進入
6)可以見到是這樣的調(diào)試界面
缺點:親測,mac中調(diào)試界面與小米6手機的界面經(jīng)常不同步,操作非常不方便,還好控制臺還是能正??礀|西
3.weinre
步驟:
1)可以直接npm install這個模塊,然后啟動,打開管理界面即可
2)直接安裝whistle,自帶了weinre。還可以代理不同環(huán)境,具體教程見:https://avwo.github.io/whistle/rules/weinre.html
缺點:可以說是極簡主義了,步驟簡單、調(diào)試簡單、能調(diào)的也簡單(就是查查元素,看看控制臺,不能像chrome那些分析工具一樣)
以上這篇基于移動端真機調(diào)試的圖文教程(分享)就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
Android開發(fā)之SeekBar基本使用及各種美觀樣式示例
這篇文章主要介紹了Android開發(fā)之SeekBar基本使用及各種美觀樣式,結(jié)合實例形式分析了Android SeekBar控件的功能及樣式改變相關(guān)操作技巧,需要的朋友可以參考下2019-03-03淺談Android為RecyclerView增加監(jiān)聽以及數(shù)據(jù)混亂的小坑
下面小編就為大家?guī)硪黄獪\談Android為RecyclerView增加監(jiān)聽以及數(shù)據(jù)混亂的小坑。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-04-04Android Studio4.0解決Gradle下載超時問題
這篇文章主要介紹了Android Studio4.0解決Gradle下載超時問題,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2020-10-10mui.init()與mui.plusReady()區(qū)別和關(guān)系
給大家分享一下在使用MUI進行APP開發(fā)的時候,mui.init()與mui.plusReady()區(qū)別以及使用上不同之處。2017-11-11關(guān)于WebView 重定向行為導致的多次加載的問題
這篇文章主要介紹了關(guān)于WebView 重定向行為導致的多次加載的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-03-03利用SurfaceView實現(xiàn)下雨與下雪動畫效果詳解(Kotlin語法)
這篇文章主要給大家介紹了關(guān)于利用SurfaceView實現(xiàn)下雨與下雪動畫效果的相關(guān)資料,需要一些基本的View知識和會一些基礎(chǔ)Kotlin語法,文中給出了詳細的示例代碼供大家參考學習,需要的朋友們下面隨著小編來一起學習學習吧。2017-09-09