移動端真機調試方法

来源:http://www.cnblogs.com/LuckyWinty/archive/2017/12/17/8052540.html
-Advertisement-
Play Games

最近要分析web頁面,在安卓和ios上的性能差異,除了操作系統本身不同之外,應該還多地方要探究的,第一步就是要在真機上分析。所以總結一下幾個方法。 1.Mac+iPhone+ Lightning+Safari 瀏覽器 步驟: 1)用:Lighting線將mac與iphone相連 2)iphone打開 ...


最近要分析web頁面,在安卓和ios上的性能差異,除了操作系統本身不同之外,應該還多地方要探究的,第一步就是要在真機上分析。所以總結一下幾個方法。

1.Mac+iPhone+ Lightning+Safari 瀏覽器

步驟:

1)用:Lighting線將mac與iphone相連

2)iphone打開Web檢查器(設置->Safari->高級->Web檢查器)

3)iphone用safari打開要進行分析的頁面

4)mac打開safari瀏覽器(菜單->開發->對應的手機名稱->要調試的頁面),點擊即進入Safari Developer Tools

 

 

5)可以見到的調試界面是這樣的

 

缺點:不能調試webView裡面的頁面

 

2.安卓手機+安卓數據線+電腦

步驟:

1)用數據線將手機與電腦相連

2)手機開啟use調試(安卓不同機型開啟的步驟不盡相同,不知道的百度一下)

3)打開chrome,輸入chrome://inspect/#devices,勾選Discover USB devices

4)用手機chrome打開要調試的網頁(如果是其他webView頁面,需要在app配置啟動代碼,詳鍵官方教程)

5)選擇你要調試的頁面進入

6)可以見到是這樣的調試界面

缺點:親測,mac中調試界面與小米6手機的界面經常不同步,操作非常不方便,還好控制台還是能正常看東西

3.weinre

步驟:

1)可以直接npm install這個模塊,然後啟動,打開管理界面即可

2)直接安裝whistle,自帶了weinre。還可以代理不同環境,具體教程見:https://avwo.github.io/whistle/rules/weinre.html

 

缺點:可以說是極簡主義了,步驟簡單、調試簡單、能調的也簡單(就是查查元素,看看控制台,不能像chrome那些分析工具一樣) 

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 前面的話 面向對象的設計原則,可以說每種設計模式都是為了讓代碼迎合其中一個或多個原則而出現的, 它們本身已經融入了設計模式之中,給面向對象編程指明瞭方向。適合javascript開發的設計原則包括是單一職責原則、最少知識原則和開放封閉原則。本文將詳細介紹面向對象的設計原則 單一職責原則 就一個類而言 ...
  • 今天,給大家分享一個每一個程式員,或者說是碼農都會有的通病 自我懷疑。無論你的技術到達任何程度,如何任何境界,或許某一刻你的指尖會停頓,因為你的自我懷疑。 “你若想嘗試一下勇者的滋味,一定要像個真正的勇者一樣,豁出全部的力量去行動,這時你的恐懼心理將會為勇猛果敢所取代。”心理學家丘吉爾說得一句話。其 ...
  • Chimee是由奇舞團開源的一套H5視頻播放器解決方案,由奇舞團視頻雲前端團隊結合在業務和視頻編解碼方向的沉澱積累傾心打造。Chimee支持MP4、M3U8、FLV等多種媒體格式,同時它也幫我們解決了大部分的相容性、差異化問題,包括全屏、自動播放、內聯播放、直播解碼等常見媒體播放需求。 ...
  • 一、屬性相關 我們通常把特征(attribute)和屬性(property)統稱為屬性,但是他們確實是不同的概念,特征(attribute)會表現在HTML文本中,對特征的修改一定會表現在元素的outerHTML中,並且特征只存在於元素節點中;屬性(property)是對於JS對象進行修改,除了瀏覽 ...
  • 留存root javascript // Establish the root object, ( ) in the browser, // on the server, or in some virtual machines. We use // instead of for support. v ...
  • 時間:2017年12月17日 20:53:43 用於:個人總結 javascript知識點總結:1.獲取對象:document.getElementById("id")/document.getElementsTagName("li")2.事件 滑鼠事件: onclick 點擊 onmouseove ...
  • 性能分析。。。 window.performance.timing中相關屬性語義: 1.主要性能分析指標 一般指標: 實際前端更關註的指標(需要在實際中結合自身代碼): console.log('首屏圖片載入完成 : ',window.lastImgLoadTime - window.perform ...
  • 前面的話 適配器模式的作用是解決兩個軟體實體間的介面不相容的問題。使用適配器模式之後,原本由於介面不相容而不能工作的兩個軟體實體可以一起工作。適配器的別名是包裝器(wrapper),這是一個相對簡單的模式。在程式開發中有許多這樣的場景:當試圖調用模塊或者對象的某個介面時,卻發現這個介面的格式並不符合 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...