我应该在Phonegap/Cordova应用中使用CSS重置还是规范化(normalize)?

4

我想知道是否应该包含一个css重置或css标准化库(如果我想跨多平台构建实现一致性)?

我的担忧当然是应用速度、加载时间和内存使用,目标当然是在各个平台上实现UI的一致性...


抱歉,我对下面没有结论性的答案感到不满意...截至今天仍在等待! - ethanpil
以下所有答案都是有效的。我曾经想要投票关闭这个问题,因为它在很大程度上是基于观点的,但看起来你拒绝某些答案是因为它们没有提供明确的研究或性能数据。我不禁想知道在包含或不包含CSS重置方案时,你做了哪些性能分析。 - CodingWithSpike
在今天 @Martin Barker 的更新和澄清之后,我对他的回答感到满意并已接受了它。 - ethanpil
5个回答

2
概述:
CSS重置是必要的,因为Cordova / Phonegap都使用手机本地浏览器,因此Windows Phone是Internet Explorer包装器,Android现在是Chrome包装器(旧版本使用自己的浏览器包装器),iOS使用相应版本的Safari移动版,所有这些都对HTML5有更多的支持,因此可能会有差异。这意味着您需要进行重置,以便您拥有与桌面网站相同的基础设施,适用于所有设备/浏览器。但性能完全取决于您正在做什么,如果您只使用小型基本重置,则会减少一些负载,但即使是大型重置,您是否还会注意到它,而不是没有它。
CSS重置:
所以我们知道浏览器在CSS引擎默认字体和其他方面有轻微差异,因此我们使用重置来防止这种情况发生,这对移动浏览器也是如此(这就是cordova / phonegap使用的)。因此,建议始终进行重置,即使您正在为iOS和Android构建cordova / phonegap移动应用程序,这也是非常麻烦的,因为Android支持大量设备尺寸,而iOS只有少数几个。但这些尺寸可能会带来巨大的问题,更不用提您必须使用的DDPI,因为DPI变化如此之大。
性能:
有轻微的性能下降,除非您包含一个大型CSS重置系统(例如http://getbootstrap.com/css/),否则您不会在任何测量中看到它,这将增加一些性能损失,但如果您的JavaScript从phonegap到init()需要多0.5秒,您会注意到吗?然而,首先查看Bootstrap,如果其中有您要使用的内容,只为节省开发时间而值得。我经常使用来自http://html5doctor.com/html-5-reset-stylesheet/的警报等小组件。
来源: 互联网上充满了教程,告诉你要实现重置! https://www.google.co.uk/search?q=Phonegap+use+CSS+Reset&oq=Phonegap+use+CSS+Reset&aqs=chrome..69i57j69i60l3.3494j0j7&sourceid=chrome&es_sm=0&ie=UTF-8 你想要事实,好的,请停止使用 Phonegap/Cordova,因为它大多数情况下都是实现或利用 HTML5!HTML5仍在不断发展中,因此不应该使用!http://www.w3.org/TR/html5/ 我:拥有5年的移动开发经验,包括开发Windows Phone 7 Phonegap的部分内容。我曾是平台预览应用程序的开发人员,因此在大多数用户知道WP7即将推出之前,我就已经为WP7构建了Phonegap的部分功能。

这正是我的观点!!!我知道一个事实,即iOS嵌入式浏览器与Android的嵌入式浏览器不同,首先Android支持Flash!!! - Barkermn01
无法获得准确的统计数据,因为每个设备都不同,这就是Android的重点。Android设备有单核400 MHz处理器,也有1.0 GHz 64位四核处理器。而iPhone则有1、2、3、3g、3gs、4、4s、5、5s、5c等型号,性能各异,取决于操作系统版本和后台运行的应用程序等因素。因此,我可以给你提供来自我的三星Galaxy S5的统计数据,但这些数据可能与其他设备不匹配,因为我安装了Avast并且一直在扫描。 - Barkermn01

0

是的,你应该这样做!

我开发了跨平台应用程序。

每次我都使用CSS重置。


这并没有提供问题的答案。如果要批评或请求作者澄清,请在他们的帖子下留言 - 您始终可以在自己的帖子上发表评论,并且一旦您拥有足够的声望,您将能够评论任何帖子 - Eugene Podskal
事实上,@EugenePodskal,他正在回答这个问题。 - Sergi Juanola
如果我回答“不,你不应该这样做!我没有……”而没有任何解释,那么你会如何反应?这篇帖子可能给出了一个答案,但它不是一个基于客观标准的充分思考过的答案,因为它是基于个人经验而不是客观标准。虽然它可以被扩展,但目前还没有。所以,这就是为什么我在VLQ查询中标记它的原因。 - Eugene Podskal
嗯,我同意你的看法@EugenePodskal,但在这种情况下,没有一个答案会被视为这个问题的答案。的确,数字给了我们理解要遵循什么的方法,但数字仍然可能掩盖使用它(或不使用它)的好处。无论如何,让我们期待一个有意义的答案。 - Sergi Juanola

0
当然。如果你要为多个平台开发应用程序,那么这听起来是个好主意。尽管我毫不怀疑你仍会在不同平台上遇到差异。
我看不出它会如何影响应用程序的速度/加载时间/内存使用率。

包含类似于“bootstrap.css”的内容可能会增加很多加载时间,因为它是一个大文件。 - Barkermn01

0

-1

我不确定一个 Phonegap 应用的确切背景,因为我从未真正参与过其中任何一个,但从性能角度来看,任何 CSS 重置都不应该产生影响。

然而,我的观点是,往往你甚至不必费心去针对一堆特定元素和属性使用全面的 CSS 重置 - 你通常会在样式表中进一步覆盖它们。

一个简单的通用选择器边距/填充重置就是我今天所使用的全部内容,我会加上我最喜欢的盒模型微调。

* {
    margin:0;
    padding:0;
    box-sizing:border-box;
}

也许 10 年前,有人会告诉你通用选择器很慢,那时可能是真的,但在今天仅使用它已被证明绝对无害。
几乎所有最近浏览器的渲染/布局引擎都非常快,更不用说即使是低端移动设备现在也配备了多核 CPU。
我甚至不会称其为微小优化,因为它的影响如此之小。
如果你要使用 div.header * - 那就要昂贵得多了,但如果页面上没有几千个元素,这可能还不值得熬夜。 阅读并自行测试。

这个问题特别询问 PhoneGap/Cordova 应用程序。这不是一个关于一般的重置优点或策略的问题。 - ethanpil
据我所知,PhoneGap/Cordova 应用程序由设备的默认网络浏览器呈现。它使用相同的布局引擎。几行 CSS 代码在任何环境下都不会对性能产生影响,因此比较并非无关紧要。 - senectus
如果您参考我回答末尾的链接,您会发现一款预算平板电脑在运行旧版Android的情况下,在针对大量复杂选择器的页面中渲染约7000个元素只需要略过1秒钟。在实际项目中,一个基本的CSS重置,即使是在最慢的设备上,也不应该增加超过100毫秒的渲染时间,而且它远没有这种人为测试那么密集。 - senectus
因为您发布了“我不确定PhoneGap应用程序的确切上下文,因为我从未真正参与过其中任何一个”,而这个问题的整个上下文都是关于PhoneGap的,所以您会收到负面评价。 - ethanpil
谢谢,祝您有美好的一天。 - ethanpil

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接