小试牛刀chrome来调试APP

引子



不论是web端还是app端,对于前端页面的性能优化方法都是一样的,思路也是通用的。在《前端页面性能测试普及课》中已经详细讲解过了,这里不再阐述,感兴趣的可以看看,地址:http://edu.51cto.com/course/9202.html

以下说的app调试对于里面的webview的优化也是一样的。

准备步骤



手机root

打开开发者模式

打开usb调试

使用数据线连接电脑

本地电脑安装好chrome

调试webview网页



启动chrome,并输入chrome://inspect

启动浏览器或者chrome去访问任意网站

点击要分析的URL下方的inspect即可,之后就会进入调试工具,和pc上的无差异

PS:如果点击inspect之后是白页,那么你需要翻墙。。。。。

调试APP



如果想调试app,app必须是debug版本的或者打开了Cordova 打包的app,总之app代码里需要做一些配置(具体的开发都会弄了,你不必操心)

时间: 2024-08-08 21:52:37

小试牛刀chrome来调试APP的相关文章

chrome浏览器使用chrome://inspect调试app 网页,打开空白的问题

使用chrome浏览器,输入chrome://inspect可以调试android app里面的网页,如果inspect的时候,是空白, 那就在C:\Windows\System32\drivers\etc\hosts文件加入 61.91.161.217 chrome-devtools-frontend.appspot.com61.91.161.217 chrometophone.appspot.com

移动端Web开发调试之Chrome远程调试(Remote Debugging)

本篇主要说一下Chrome RemoteDebugging 的方法,之前也遇到一些坑,自己总结了一些经验,分享如下. Chrome DevTools调试移动设备Brower Page Tabs/WebViews 安卓远程调试目前支持所有操作系统(Windows,Mac, Linux, and Chrome OS.)中调试,支持: ● 调试站点的页面 ● 调试安卓原生App中的WebView ● 实时将安卓设备的屏幕图像同步显示到开发机器. ● 通过端口转发(port forwarding)与虚拟

安卓手机移动端Web开发调试之Chrome远程调试(Remote Debugging)

一.让安卓打debug模式的apk包 二.将电脑中的chrome升级到最新版本,在chrome浏览器地址栏中输入chrome://inspect/#devices: 在智能手机还未普及时,移动设备的调试处处是alert的,这估计是最常用的办法了.以前很多时候为了预览页面在移动设备上的效果,需要先将页面上传到测试服务器,再将url输入到设备浏览器,或者使用第三方二维码扫码应用,通过移动设备访问打开浏览实际效果,每次换设备都要重复这些操作,页面多的话这些繁琐的事情就特别让人厌烦了.移动互联网的浪潮,

使用Chrome Inspect调试WebApp

作者:zhanhailiang 日期:2015-03-10 在PC上有大量的开发调试工作,但是针对需要在移动设备上调试的页面,目前缺乏有效的工具,只能通过PC来模拟测试,为此Chrome支持远程调试Android设备,详情请见Remote Debugging on Android with Chrome. 安装步骤 开启移动设备开发者选项,若和笔者一样使用M4,可参见小米4如何进入开发者选项: 在PC上安装OEM USB Drivers,官方安装教程:OEM USB Drivers,下载路径:l

使用chrome远程调试设备及调试模拟器设备

使用chrome开发工具远程在Android上远程调试 准备工作 开始远程调试之前,需要做好如下准备: 在你电脑上安装Chrome 32 或者更新的版本 一根连接Android设备的USB线 手机系统是Android 4.0+ 并且在手机上安装Android版本的Chrome浏览器. 注意:远程调试需要电脑上的chrome浏览器版本比手机上的chrome浏览器版本新. 设置Android手机 在Android手机上选择 设置>开发人员工具>USB调试,然后会弹出一个提示框"是否允许U

通过chrome浏览器调试手机页面(IOS和Android)

开发PC页面的时候使用chrome浏览器的开发者工具,可以很容易的捕获到页面的dom元素,并且可以修改样式,方便调试,但是手机上却很麻烦,因为手机上没有办法直接打开开发者工具查看元素.其实可以通过将设备连接到PC,使用PC的开发者工具检测 一.针对android设备 1.在android设备上开始开发者模式 2.将设备连接到PC,在chrome浏览器地址栏输入:chrome://inspect/#devices 3.在手机上打开网页的时候,chrome就会检测到网页,可以直接调试 二.针对IOS

Android使用蓝牙连接adb调试App

使用WiFi连接Android设备调试APP的教程非常多,可是项目中须要使用蓝牙进行通信.所以牵扯使用蓝牙调用adb. 1.   将电脑蓝牙与手机进行配对(控制面板->设备和打印机->加入设备) 2.   在手机上设置(设置à 很多其它无线连接à网络共享à蓝牙共享网络) 3.   PC端,设备和打印机->选择配对好的手机->右键->连接时使用->訪问点 4.   连接成功后打开CMD查询蓝牙适配器的ip 5.下载应用这个不用说了.执行超级终端. 开启WiFi锁 6.执行

AndroidStudio调试APP

AndroidStudio调试APP 电脑用数据线连上手机 开启手机的开发者模式 注:通常连续狂点手机的版本号即可显示出开发者选项,然后进入菜单,勾选开发者选项.USB调试. 给程序加断点 单击调试按钮,弹出设备选择面板,选择您的手机 软件需要编译一段时间,耐心等待 绑定App进程 注:不同的App绑定方法不太一样,但大同小异,以下以Coopad F2为例 待app在手机启动之后,进入手机开发者选项,选择调试应用为你要调试的App 紧跟在手机上打开该App,然后在AS中点击[绑定]按钮绑定该Ap

在 Chrome 中调试 Android 浏览器

最近需要使用 Chrome Developer Tools 调试 Android 浏览器,但是官方指南并不是很好使,经过一番折腾,终于调试成功了,在此把经验分享给需要的朋友. Chrome Developer Tools 是前端工程师必不可少的工具,它极大的提高了我们的开发调试效率.在移动开发的时代,我们也必须掌握手机浏览器在 Chrome 中调试的方法.本篇仅介绍 Android. 环境 不同的环境可能存在一些差异,我的环境是: Windows 10 电脑 Chrome 50.0.2661.7