免费获取策划方案多一份参考,总有益处

重庆网站建设公司

Website construction company

案例778

重庆网站建设公司

浏览器设计与Lambdatest不一致

来源:xk星空官方网站|时间:2020-03-22|浏览:

当网络还很年轻的时候,一个56k的连接速度很快,CSS是新的,Flash在Macromedia眼中只是一个亮点。有一个短语出现在了一半的闪屏上:在IE6中浏览效果最好。

你看,早在20世纪初,互联网的竞争就没那么激烈了。完全有可能忽略掉40%的用户而仍然盈利。事实上,考虑到为每个浏览器维护不同的代码库的开销,为多个浏览器构建代码库在财务上往往是不可行的。

前端代码在不同的浏览器中呈现的方式仍然非常不同

多年来,web的竞争变得更加激烈,开发人员开始认真考虑如何为更广泛的受众编写站点代码;网络标准开始出现。

很难想象,如果没有网络标准的支撑,我们将如何应对移动网络的指数级增长。然而,web标准助长了浏览器一致显示代码的误解;事实上,前端代码在不同的浏览器中呈现出来的效果仍然非常不同。

为什么浏览器不一致?

尽管业界普遍认同web标准,但浏览器呈现web页面的方式仍然非常不同。原因如下:

不断发展的网络标准

发布CSS3、HTML5,尤其是ECMAScript的新特性需要很长时间。从最初的提案到建议,有数百个修改和修正。

问题是早期采用者经常发现他们使用的是一个过时的规范版本。

以CSS的Flexbox为例,它在所有主流浏览器上都享有良好的支持,甚至在IE上也是如此;不幸的是,微软编写了一个较老版本的规范,任何仍然需要支持IE的人将发现他们需要运行向后兼容的代码。

解释的空间

Web标准故意留下了大量的解释空间。由于规范引用了默认设置,所以有许多属性以不同的方式呈现,但没有定义该默认设置。

虽然这可能令人沮丧,但这种灵活性是有充分理由的:将macOS的Safari浏览器上的select元素与iOS的Safari浏览器上的select元素进行比较;不仅是选择风格不同,因为它将是在边缘,或Chrome -这是一个完全不同的用户界面元素!

bug、遗留代码和黑客攻击

像所有的程序员一样,构建浏览器的工程师也不是完美的。他们的工作压力、截止日期和营销部门都和我们一样。结果是不完整的代码常常有bug,特别是在边缘情况下。

有一个典型的浏览器bug只出现在Chrome中:带有占位符文本的输入字段,在Y轴上旋转180度,出人意料地覆盖了backface-visibility属性。的原因吗?不知什么时候,有人在Chrome的引擎上工作(可能是为了加速渲染),选择切换可见性,而不是检测当前的当前状态。

设计不一致

幸运的是,浏览器大战已经过去很久了。但是,由于上面列出的原因,开发人员必须接受这样一个事实,即浏览器是不一致的。

当然,网站不需要每一个浏览器和设备上看起来一样——的原因之一,有多种浏览器,不同的用户有不同的喜好,但网站必须功能,和熟悉(尤其是在移动和桌面)然而用户选择访问它。

测试站点的一种方法是购买10-20台计算机和20-30台移动设备,在每台设备上安装多个浏览器,每次修改代码时都要在每台设备上进行艰苦的测试。

更聪明的方法是使用像Lambdatest这样的跨浏览器测试应用程序。

设计与Lambdatest

Lambdatest是一个SaaS,它支持在各种设备上进行测试,让您的开发机器也能轻松地进行测试。您不需要任何特殊设备,只需登录网站进行一系列不同的测试选择:

跨浏览器测试

Lambdatest可以让你在2000多个不同的浏览器上进行实时的交互测试。这些不是模拟器,它们是您远程访问的实际浏览器实例。

通过一个直观的用户界面,你可以浏览macOS、iOS、Windows和Android上的顶级浏览器。比较不一致性,甚至使用屏幕截图和视频选项来记录问题区域。

这种手工测试方法非常灵活,对于检查构建的各个组件非常理想。这对于检查bug修复是否完全解决非常有用。但是对于真正全面的测试来说,手工测试是劳动密集型的,因为Lambdatest提供了自动化测试。

自动化测试

Lambdatest真正发挥作用的地方是自动化测试。自动化允许您测试您的设计,最多可以测试2000多个浏览器实现。只需选择您想要测试的操作系统和浏览器,运行自动化的屏幕截图过程,并在仪表板中查看结果。

对于在开发过程中进行的测试,您可能只想比较目标浏览器,但是对于任何构建里程碑,都应该尽可能全面地进行测试。

使用restful API,您可以自动记录日志、测试元数据,并以世界记录的速度查找bug,从而节省您的时间、金钱和声誉。

第三方集成

除了手工测试和自动化之外,Lambdatest还集成了大量的第三方工具,包括Jira、GitLab和Trello。这意味着您可以彻底地测试您的站点,而不必离开您现有工作流程的安全性。

它还有一个Chrome扩展和一个WordPress插件。这两款工具都可以让你在2000多个浏览器上对你的网站进行截屏,你只需在浏览器或WordPress管理面板上点击一下即可。

聪明的比较测试

也许我们最喜欢的特性是智能UI测试特性。这个创新的功能可以自动检测出什么地方出了问题。对于远程工作的设计人员和开发人员来说,这是非常好的,因为他们没有同事的新眼睛来检查更改。

只需从Lambdatest的自动化测试中调出一个屏幕截图作为基线,然后运行智能比较测试工具,它将标记出任何显著的差异。

当您快速修复bug时,这是一个非常好的工具,需要再次检查修复是否破坏了其他东西。考虑到代码中的绝大多数bug都是在浏览器不一致的情况下引入的,所以最好检查一下引入的解决方案是否会带来大量全新的问题。

为什么选择Lambdatest

为了覆盖市场上更流行的品牌,您需要测试的不同浏览器和设备的数量对于大多数团队来说都是非常昂贵的。更不用说持续更新的需求。Lambdatest消除了这种成本,并使全面的测试在每个网络专业人士的能力范围内。如果没有Lambdatest支持的跨浏览器测试,设计和构建一个现代网站几乎是不可能的。

我们喜欢Lambdatest的原因是它是一种灵活的方式,可以将全面和可靠的测试工作到您现有的工作流程中。还有其他一些应用程序可以让你在不同的浏览器上进行测试,但它们通常会迫使你采用一种新的工作方式,Lambdatest不会。

留言

返回顶部

君
重庆网站建设重庆网站建设公司浏览器设计与Lambdatest不一致
XML 地图