原生OR模拟

我最近又陷入了模拟控件和原生控件的纠结中。

早期我们做PC端网页开发,就已经讨论过一次模拟控件(表单)和原生控件(表单),当初各种各样的理由,我们很推崇原生控件(标准化、语义化、渐进增强)

但是最近这两年接触Mobile端的网页开发后,我的立场摇摆了。

原生控件

优点:使用简单,”兼容性强”

使用简单很好理解,表单元素就那么几个,其DOM Event和DOM Attr也屈指可数,使用起来非常方便。

为什么要给兼容性强打上引号呢?因为单独使用,的确兼容性很强,Web标准。

缺点:“兼容性差”

为什么又是兼容性呢?主要体现在Mobile端的浏览器,对于可交互元素,尤其是表单元素,有很多特殊的处理。

FastClick好用吗?iScoll好用吗?都很好用,但为什么网上那么多负面的评论?

去仔细看内部的源码,里面由非常多可交互元素的hack,并且都留有issue单。就是因为不同浏览器、甚至同一款浏览器的不同版本,对这种可交互元素的处理机制不一,导致各种各样未知bug。而这种bug,只能case by case的修复。

这里我又想黑一下自己的公司,X5也有很多case by case的自认为的对可交互元素的处理机制优化。

模拟控件

优点:完美还原交互,兼容性强

设计还原能力,就不用说了,自己写的业务实现,可以完美实现各种交互效果(当然仅限于当前科技范畴了)

而兼容性,因为采用的是最基础的手段,所以满大街的设备都会支持,并且都当做普通的DIV\CSS\JS来处理,不会有什么特殊情况,也不需要case by case的去解决一些兼容问题。

缺点:不标准,复用性不高,开发成本大

这种控件针对性很强,也就导致了复用性不高。

因为不是标准控件,所以所有东西都需要自己实现,大量边界条件需要自己想清楚,开发成本很大。

结语

其实我也不知道该怎么结束这个话题、我也在纠结中~~~

WebComponent也好,以前的htc也罢,还有React Canvas,不也是为了解决这种问题嘛(看上去这三个好像差很远,尤其是React Canvas。但其实都一样,都是用自定义的东西去统一实现输入输出,从而避免浏览器的差异化处理)。

也许未来移动端浏览器对于可交互元素的处理趋向一致和稳定后,我们的想法又会变得不一样。

最后补一句,我纠结的问题,是移动端富交互的场景,普通的展示型页面,还是该怎么来怎么来,不受影响的。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏九彩拼盘的叨叨叨

前端学习

前端主要包括 HTML,CSS,JavaScript。开始的时候,可以看熟悉下基本概念

934
来自专栏HTML5学堂

无技术基础 看懂HTML5

HTML5学堂:如果你对C语言、网站制作等技术没有什么了解,你可以查看这篇文章。无论你是唱歌的艺术生,还是学习机械专业的工科生,或者大学读的文学学科。只要你平时...

44711
来自专栏直播系统开发

关于直播系统和短视频系统安卓手机屏幕适配的方向思路

直播与短视频的接踵而至,将互联网推向了网红经济时代,而智能手机的更新迭代为二者的发展提供了“温床”。但随着Android机型的增多,设备碎片化的程度也在不断加深...

1250
来自专栏网站设计制作、数字营销

企业网站如何制作才能适应SEO

中小企业网站多数以展示企业产品及服务为主,网站功能已展示为主,网站的内容也是围绕着企业的产品或服务做介绍。对于中小企业网站做推广的方式中,搜索引擎营销是目前中小...

720
来自专栏数据小魔方

文字云,没你想的那么高大上!!!

今天给大家聊聊文字云 文字云是手机新品发布会PPT御用技巧 无论是卖产品的 还是卖情怀的 都是段子手 一个比一个bigger高 让我们来看看 那些高逼格的人 ...

5987
来自专栏前端黑板报

适配iPhone X 的齐刘海

当苹果宣布发布他们的旗舰手机-- iPhone X 的时候,他们允诺将为未来移动设备设定新的标准。我们决定需要了解一些内容。 “屏幕再也不必是方...

2369
来自专栏闰土大叔

一个JS效果竟然要研究一天,我是不是不适合做前端?

前言 今天这篇文章的标题,显然是要搞事情。一个JS交互效果,居然花费了一天的宝贵时间才研究出来,我是不是不太适合做前端? 别急,搬好小板凳,正文从这开始~ 本...

54017
来自专栏知晓程序

如何转行小程序开发?不同品种的程序员该这样做

1342
来自专栏程序人生 阅读快乐

《HTML5 canvas开发详解(第2版)》富尔顿 等(作者)epub

随着Canvas的持续升温,Flash的光芒迅速消退。本书是Canvas的畅销图书,它在上一版的基础上,通过讲解如何开发可交互式多媒体应用,引导读者学习HTML...

1442
来自专栏姬小光

写给设计师的移动页面适配小知识

话说从设计稿到前端页面实现,是产品流程中非常重要的一环,这个阶段决定了设计师设计的设计稿能否完美地变成真正的产品雏形。废话不多说,本文主要介绍以下三块内容:移动...

1082

扫码关注云+社区