《移动网页设计与开发 HTML5+CSS3+JavaScript》—— 1.7 测试,再测试,进行更多的测试

简介:

本节书摘来异步社区《移动网页设计与开发 HTML5+CSS3+JavaScript》一书中的第1章,第1.7节,作者:【英】Peter Gasston,更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.7 测试,再测试,进行更多的测试

对于目前网络设备的现状,测试是确保所创建网站是否能跨多个设备运行的唯一方法。测试一直贯穿着整个项目,从开始到结束,都要抓住任何机会进行测试。如果规划的是一个多设备项目,那么,在整个项目中,多达40%至50%的时间将会用来测试。这是个很严肃的问题。

如果找不到实际设备的代替品来做测试,则可以着手建立一个库,并放入尽可能多的设备。如果单位附近有其他机构,还可以考虑集中资源,以获得范围更广的设备。许多城市都在组建设备实验室,其中有各种设备可供任何人使用,这些设备均由当地开发人员和公司捐赠。你还可以在线搜索最近的实验室,或者,考虑在公司或工作的地方参与组建一个实验室。

不要只对手机和平板电脑进行测试。如果网站的目标对象是年轻爱好者(研究表明,大约四分之一的美国青少年使用游戏机浏览器上网),则应该考虑测试游戏机浏览器;或者,如果网站瞄准的是休闲市场,则应该对电视设备进行测试。

如果无法使用实际设备,则可以使用一些专用的工具,大多数(也可能是全部)操作系统创建者和/或设备制造商都有可供免费下载的、设备模拟器的软件开发工具包(SDK)。在手机和平板电脑领域,安卓、Windows Phone和黑莓都有软件开发工具包,毫无疑问,除了它们之外,还有更多其他的品牌。在苹果的App商店里可以找到苹果公司的Xcode,它有iOS模拟器功能,在测试中,可以在设备和操作系统版本之间进行切换。

一旦设置好,许多这样的软件开发工具包还允许USB连接物理设备,通过配对的浏览器来做调试。但是,还有个更简单易行的方法—使用Opera的手机仿真器,一旦将其打开并连接到Opera的桌面版本,就可以使用在桌面上的开发人员工具来调试移动设备上的页面。如果需要使用WebKit—它主导着多设备引擎,为什么不用呢?—名为weinre的软件可以把台式机上的Chrome或Safari连接到安卓、iOS或黑莓模拟器上。

Adobe有一个叫做Edge Inspect的截图查看器,可以让任何使用Edge Inspect应用程序(眼下在iOS和安卓系统上可用)的设备与Chrome浏览器同步。这样,用户就能同时在许多不同的设备上预览网站,并用网络检查器进行远程调试。

相关文章
|
25天前
|
开发框架 JavaScript 安全
js开发:请解释什么是Express框架,以及它在项目中的作用。
Express是Node.js的Web开发框架,简化路由管理,支持HTTP请求处理。它采用中间件系统增强功能,如日志和错误处理,集成多种模板引擎(EJS、Jade、Pug)用于HTML渲染,并提供安全中间件提升应用安全性。其可扩展性允许选用合适插件扩展功能,加速开发进程。
|
26天前
|
缓存 JavaScript 前端开发
js开发:请解释什么是Webpack,以及它在项目中的作用。
Webpack是开源的JavaScript模块打包器,用于前端项目构建,整合并优化JavaScript、CSS、图片等资源。它实现模块打包、代码分割以提升加载速度,同时进行资源优化和缓存。借助插件机制扩展功能,并支持热更新,加速开发流程。
17 4
|
26天前
|
缓存 JavaScript 数据安全/隐私保护
js开发:请解释什么是ES6的Proxy,以及它的用途。
`ES6`的`Proxy`对象用于创建一个代理,能拦截并自定义目标对象的访问和操作,应用于数据绑定、访问控制、函数调用的拦截与修改以及异步操作处理。
17 3
|
26天前
|
JavaScript
js开发:请解释什么是ES6的类(class),并说明它与传统构造函数的区别。
ES6的类提供了一种更简洁的面向对象编程方式,对比传统的构造函数,具有更好的可读性和可维护性。类使用`class`定义,`constructor`定义构造方法,`extends`实现继承,并可直接定义静态方法。示例展示了如何创建`Person`类、`Student`子类以及它们的方法调用。
21 2
|
27天前
|
自然语言处理 JavaScript 网络架构
js开发:请解释什么是ES6的箭头函数,以及它与传统函数的区别。
ES6的箭头函数以`=>`定义,简化了函数写法,具有简洁语法和词法作用域的`this`。它无`arguments`对象,不能用作构造函数,不支持`Generator`,且不改变`this`、`super`、`new.target`绑定。适用于简短表达式,常用于异步编程和高阶函数。
17 5
|
27天前
|
JavaScript 前端开发 算法
js开发:请解释什么是虚拟DOM(virtual DOM),以及它在React中的应用。
虚拟DOM是React等前端框架的关键技术,它以轻量级JavaScript对象树形式抽象表示实际DOM。当状态改变,React不直接操作DOM,而是先构建新虚拟DOM树。通过高效diff算法比较新旧树,找到最小变更集,仅更新必要部分,提高DOM操作效率,降低性能损耗。虚拟DOM的抽象特性还支持跨平台应用,如React Native。总之,虚拟DOM优化了状态变化时的DOM更新,提升性能和用户体验。
21 0
|
4天前
|
开发框架 前端开发 JavaScript
采用C#.Net +JavaScript 开发的云LIS系统源码 二级医院应用案例有演示
技术架构:Asp.NET CORE 3.1 MVC + SQLserver + Redis等 开发语言:C# 6.0、JavaScript 前端框架:JQuery、EasyUI、Bootstrap 后端框架:MVC、SQLSugar等 数 据 库:SQLserver 2012
|
17天前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性
|
26天前
|
Web App开发 JavaScript 前端开发
js开发:请解释什么是Node.js,以及它的应用场景。
Node.js是基于V8的JavaScript运行时,用于服务器端编程。它的事件驱动、非阻塞I/O模型使其在高并发实时应用中表现出色,如Web服务器、实时聊天、API服务、微服务、工具和跨平台桌面应用(使用Electron)。适用于高性能和实时需求场景。
18 4
|
26天前
|
JavaScript 前端开发 编译器
js开发: 请解释什么是Babel,以及它在项目中的作用。
**Babel是JavaScript编译器,将ES6+代码转为向后兼容版本,确保在旧环境运行。它在前端构建中不可或缺,提供语法转换、插件机制、灵活配置及丰富的生态系统,支持代码兼容性和自定义编译任务。**
17 6