本文主要包含CSS,html,JavaScript,Flash,W3C等相关知识,匿名希望在学习及工作中可以帮助到您
作为一个业余爱好者,我已经对 Web 前端充满了消极情绪,各种深坑如下:
曾经非常喜欢 Flash,因为她在各个平台都能一致的表达,各种布局随心所欲,执行动画效率很高,音频、视频、甚至3D都能很好的操控,你完全不用担心各种兼容问题。
想问问各位大神:现在最尖端的前端技术有哪些方向,有没有出现一种让我们舒心一点的技术?未来浏览器的发展会不会填平兼容性的鸿沟?
1,2是说兼容问题。我个人把兼容问题细分为简单的兼容问题和复杂的兼容问题。
简单的兼容问题是可以通过写法上去避免的。通常来讲,一个中级工程师写出来的代码基本是兼容全平台的,测兼容性也是做些细微的调整。
举几个简单兼容性的例子:
要制作三角形,有好几种方法,最简单的一种无疑是用::before和::after伪对象去做。但低版本IE是不支持伪对象的。
这个时候可以用附加DOM的方式、用特殊字符◆,最不济也能切图搞定,这些都是兼容写法。
再一个例子是题主3提到的垂直居中的问题。
下图是现有的一些解决垂直居中的方法和兼容性表。
我个人最喜欢、最常用Absolute Centering和inline-block的方式。从图可以看出Absolute Centering
不是全兼容的,这时我会结合负Margin去写几句IE7的兼容代码,至于IE6嘛,在某度实习的时候还要求兼容,之后就再没兼容过了。
可以看出,垂直居中的问题绝不是一个蛋疼的问题,都是有全兼容的解决方案的。
再谈一下复杂的兼容问题,何谓复杂呢,我个人的定义是IE低版本根本不支持,去做兼容会附加大量的代码甚至没有兼容写法。
比方说CSS3的三个动画属性transition、transform、animation,是可以通过JS去写全平台的兼容性的,不过复杂度不是一星半点,是要写大量兼容代码的。
再如HTML5的XMLHttpRequest新标准,提供了FormData让JS去模拟表单操作,而且FormData可以异步传输二进制,低版本的兼容性常用的做法是iframe或者flash。再加一个前端预览或者进度上传反馈的需求,iframe的方法就满足不了了。flash的方法有一些成型的组件可以用,不过不适合深度定制,深度定制相比HTML5的一些写法又复杂很多。
以上两个就是复杂兼容问题的例子。
基本上,能搞定所有简单的兼容性问题就能满足现有工程中的绝大部分开发需求了。复杂的效果自己尝鲜试水的多,工程中用的少。
再看第三条,题主称之为蛋疼的布局问题。
布局这种问题,于前端来讲,当是寻常之事了。里面提到的多列等高可以通过上面垂直居中的Absolute Centering来变化一下解决,垂直居中已经讲过,水平居中行内块轻松搞定,多列等宽浮动和行内块都可以解决。
非要把有清晰解决思路的问题称之为蛋疼的问题,只能说还涉足不深,有待继续磨砺。
至于分离和效率,姑且等搞定兼容性再说吧。
浏览器只是一个宿主环境,JS也只是ES的一个实例子集。 @Chris 也提到了很多其他平台的开发。像node-webkit打包前后端去提供跨平台的解决方案、APP调用WebView都是前端在向其他平台渗透的尝试。
JS商业化过早,各种前端标准也因浏览器厂商为了各自的利益而四分五裂。导致整个行业糟粕与精华并存,也导致了廉价和高手稀缺的前端行业。如今,JS也早过了复制粘贴特效的原始社会,各种前端标准也在逐渐走向规范。
此刻,正当迎来光明的关头,题主却说这之前的她让你充满了消极情绪,那,定是爱的还不够深。 兼容性问题:很多项目根本不需要考虑ie的。如果是做手机网页,所有新的api都能用。
css不好用:其实布局,居中的问题,用flexbox很容易就解决了。
动画效率:DOM的那套机制确实是慢,牵一发动全身。用css3动画的话,是有gpu加速的,不存在不流畅的问题,有点限制罢了。移动设备支持css3动画,不支持flash,你说谁更省资源,效率更高?
看出来楼主是很喜欢交互,没事做些炫酷网页效果的人。其实现有的css3,canvas能做出来很厉害的东西了。没事多来这里看看:CodePen - Front End Developer Playground & Code Editor in the Browser 不爽浏览器兼容性?行,Node.js 搞起。Web 后端、node-webkit desktop 应用、WebView 开发,都不用搞兼容性——看准一个平台写代码就成。
什么?这不是前端?好吧,该好好规划自己的职业生涯和想做的事,你看,国外那么多 Chrome、Firefox 的 web app,你也可以找做一个针对国外市场的,只要不是设计的太差,赚点小钱没问题。再进一步,做个库、框架什么的,混个研发类的活也不错。
还是不爽?那……转行吧。
Joking.
前端技术因为 Chrome 的出现,开始加速发展,IE 也被迫加快脚步,再因为移动平台的需求,发展就又更快了(听腻了吧?),W3C 跟不上是正常的,但这只是阵痛,大量优秀的特性开始加入 ES、CSS、HTML,低版本 IE 的份额也进一步被压缩,在国外,IE8 份额本身并不是很有优势,再加上下一代 Windows 可能会有免费版本的传闻,在内置的光环下,IE8、9 只会消失的更快。
兼容性,很快就不成问题。
而在新技术上,像 、Gulp、Browserify 都是相当有趣的技术,HTML5 Gaming,还有那些探求 CSS Animation 极限的玩意,前端还是很好玩的。
补充:虽然我很不喜欢 360 浏览器,但有一点它做的很对,值得为 360 团队鼓掌的,那就是他们在 2013 年 12 月份提供了 `` 标签,以供网站强制使用 WebKit 来渲染页面,如果有更多的浏览器厂商支持这个标签,真不用再担心 IE8- 了。 兼容 规范 本来就是技术的一部分啊 作为一个开发人员,虽然去年毕业。但是已经做过四个项目。从事java开发,包括后台和前端我都做。未来的发展趋势是js肯定会大放光彩,无论是手机还是pc端。页面的设计很重要,这是美工的事,我们负责将他们的设计用html,css呈现出来,这些都不难。好的效果总是能抓住人的眼熟。js就能做到。虽然现在html5还用的不多。很多浏览器不支持,但是很便捷,我想这是趋势。所以WEB前端是有前景的。 这是一个古老的故事……在几千年前……兼容性就存在了……只是那时候……还没有被人们发觉……后来ie问世了 -。- chrome问世了…… 人们就渐渐的发现了 兼容性 的存在。在战争白热化的时候,一个神秘的魔法一族出现了,他们企图坚信可以消灭万恶的 兼容性,并提出了标准化……这就是被世人歌颂为 w3c 一族..但是ie却不妥协,坚持的自己的邪恶并衍生后代继续着与兼容性的斗争,随之而来
ie6,7,8诞生了,公元前187年,ie8与chrome进行了一场殊死搏斗.. 在争夺js解析速度的战争中,chrome胜利了,从此ie家族意识到了自己的软弱,随后,和w3c握手言和,ie9,ie10,ie11都将逐渐遵循 标准化 做为一个从实习开始就做前端的程序员,我很想好好的回答下这个问题。
首先,Web最初和现在来说,最大的用途与优势还是在展示数据、文章、一些简单表单、简单界面排版等等。简而言之,就是内容为主的应用,就好比门户网站或者知乎这种,就十分适合用Web前端技术来实现界面。但是Web的未来,却不仅仅局限于此,关于未来,在最后有我自己的看法。
你吐槽的各种蛋疼兼容性问题在IE6独占天下的时候是不存在的。那时候的Web前端也是很美好的。
然而,之后的发展越来越出乎大家的意料。
首先,是硬件性能和网速的提升。提升到了可以输入一个网址就打开一个应用,无需等待太长时间,而且硬件性能跟得上,试问在这种情况下,为什么还要用客户端呢?而且web有着随时更新的巨大优势。
所以之后的发展
- 不同浏览器之间的差异与兼容。
- 相同浏览器新旧版本之间的差异与兼容。
- 蛋疼的布局问题:水平居中、垂直居中、多列等高、多列等宽、浮动等等。
- html内容数据、CSS渲染、JS脚本之间的清晰分离(CSS动画与JS动画)。
- 动画执行效率、视频、音频操纵等
曾经非常喜欢 Flash,因为她在各个平台都能一致的表达,各种布局随心所欲,执行动画效率很高,音频、视频、甚至3D都能很好的操控,你完全不用担心各种兼容问题。
想问问各位大神:现在最尖端的前端技术有哪些方向,有没有出现一种让我们舒心一点的技术?未来浏览器的发展会不会填平兼容性的鸿沟?
回复内容:
分析下楼主提出的五个深坑。1,2是说兼容问题。我个人把兼容问题细分为简单的兼容问题和复杂的兼容问题。
简单的兼容问题是可以通过写法上去避免的。通常来讲,一个中级工程师写出来的代码基本是兼容全平台的,测兼容性也是做些细微的调整。
举几个简单兼容性的例子:

这个时候可以用附加DOM的方式、用特殊字符◆,最不济也能切图搞定,这些都是兼容写法。
再一个例子是题主3提到的垂直居中的问题。
下图是现有的一些解决垂直居中的方法和兼容性表。

不是全兼容的,这时我会结合负Margin去写几句IE7的兼容代码,至于IE6嘛,在某度实习的时候还要求兼容,之后就再没兼容过了。
可以看出,垂直居中的问题绝不是一个蛋疼的问题,都是有全兼容的解决方案的。
再谈一下复杂的兼容问题,何谓复杂呢,我个人的定义是IE低版本根本不支持,去做兼容会附加大量的代码甚至没有兼容写法。
比方说CSS3的三个动画属性transition、transform、animation,是可以通过JS去写全平台的兼容性的,不过复杂度不是一星半点,是要写大量兼容代码的。
再如HTML5的XMLHttpRequest新标准,提供了FormData让JS去模拟表单操作,而且FormData可以异步传输二进制,低版本的兼容性常用的做法是iframe或者flash。再加一个前端预览或者进度上传反馈的需求,iframe的方法就满足不了了。flash的方法有一些成型的组件可以用,不过不适合深度定制,深度定制相比HTML5的一些写法又复杂很多。
以上两个就是复杂兼容问题的例子。
基本上,能搞定所有简单的兼容性问题就能满足现有工程中的绝大部分开发需求了。复杂的效果自己尝鲜试水的多,工程中用的少。
再看第三条,题主称之为蛋疼的布局问题。
布局这种问题,于前端来讲,当是寻常之事了。里面提到的多列等高可以通过上面垂直居中的Absolute Centering来变化一下解决,垂直居中已经讲过,水平居中行内块轻松搞定,多列等宽浮动和行内块都可以解决。
非要把有清晰解决思路的问题称之为蛋疼的问题,只能说还涉足不深,有待继续磨砺。
至于分离和效率,姑且等搞定兼容性再说吧。
浏览器只是一个宿主环境,JS也只是ES的一个实例子集。 @Chris 也提到了很多其他平台的开发。像node-webkit打包前后端去提供跨平台的解决方案、APP调用WebView都是前端在向其他平台渗透的尝试。
JS商业化过早,各种前端标准也因浏览器厂商为了各自的利益而四分五裂。导致整个行业糟粕与精华并存,也导致了廉价和高手稀缺的前端行业。如今,JS也早过了复制粘贴特效的原始社会,各种前端标准也在逐渐走向规范。
此刻,正当迎来光明的关头,题主却说这之前的她让你充满了消极情绪,那,定是爱的还不够深。 兼容性问题:很多项目根本不需要考虑ie的。如果是做手机网页,所有新的api都能用。
css不好用:其实布局,居中的问题,用flexbox很容易就解决了。
动画效率:DOM的那套机制确实是慢,牵一发动全身。用css3动画的话,是有gpu加速的,不存在不流畅的问题,有点限制罢了。移动设备支持css3动画,不支持flash,你说谁更省资源,效率更高?
看出来楼主是很喜欢交互,没事做些炫酷网页效果的人。其实现有的css3,canvas能做出来很厉害的东西了。没事多来这里看看:CodePen - Front End Developer Playground & Code Editor in the Browser 不爽浏览器兼容性?行,Node.js 搞起。Web 后端、node-webkit desktop 应用、WebView 开发,都不用搞兼容性——看准一个平台写代码就成。
什么?这不是前端?好吧,该好好规划自己的职业生涯和想做的事,你看,国外那么多 Chrome、Firefox 的 web app,你也可以找做一个针对国外市场的,只要不是设计的太差,赚点小钱没问题。再进一步,做个库、框架什么的,混个研发类的活也不错。
还是不爽?那……转行吧。
Joking.
前端技术因为 Chrome 的出现,开始加速发展,IE 也被迫加快脚步,再因为移动平台的需求,发展就又更快了(听腻了吧?),W3C 跟不上是正常的,但这只是阵痛,大量优秀的特性开始加入 ES、CSS、HTML,低版本 IE 的份额也进一步被压缩,在国外,IE8 份额本身并不是很有优势,再加上下一代 Windows 可能会有免费版本的传闻,在内置的光环下,IE8、9 只会消失的更快。
兼容性,很快就不成问题。
而在新技术上,像 、Gulp、Browserify 都是相当有趣的技术,HTML5 Gaming,还有那些探求 CSS Animation 极限的玩意,前端还是很好玩的。
补充:虽然我很不喜欢 360 浏览器,但有一点它做的很对,值得为 360 团队鼓掌的,那就是他们在 2013 年 12 月份提供了 `` 标签,以供网站强制使用 WebKit 来渲染页面,如果有更多的浏览器厂商支持这个标签,真不用再担心 IE8- 了。 兼容 规范 本来就是技术的一部分啊 作为一个开发人员,虽然去年毕业。但是已经做过四个项目。从事java开发,包括后台和前端我都做。未来的发展趋势是js肯定会大放光彩,无论是手机还是pc端。页面的设计很重要,这是美工的事,我们负责将他们的设计用html,css呈现出来,这些都不难。好的效果总是能抓住人的眼熟。js就能做到。虽然现在html5还用的不多。很多浏览器不支持,但是很便捷,我想这是趋势。所以WEB前端是有前景的。 这是一个古老的故事……在几千年前……兼容性就存在了……只是那时候……还没有被人们发觉……后来ie问世了 -。- chrome问世了…… 人们就渐渐的发现了 兼容性 的存在。在战争白热化的时候,一个神秘的魔法一族出现了,他们企图坚信可以消灭万恶的 兼容性,并提出了标准化……这就是被世人歌颂为 w3c 一族..但是ie却不妥协,坚持的自己的邪恶并衍生后代继续着与兼容性的斗争,随之而来
ie6,7,8诞生了,公元前187年,ie8与chrome进行了一场殊死搏斗.. 在争夺js解析速度的战争中,chrome胜利了,从此ie家族意识到了自己的软弱,随后,和w3c握手言和,ie9,ie10,ie11都将逐渐遵循 标准化 做为一个从实习开始就做前端的程序员,我很想好好的回答下这个问题。
首先,Web最初和现在来说,最大的用途与优势还是在展示数据、文章、一些简单表单、简单界面排版等等。简而言之,就是内容为主的应用,就好比门户网站或者知乎这种,就十分适合用Web前端技术来实现界面。但是Web的未来,却不仅仅局限于此,关于未来,在最后有我自己的看法。
你吐槽的各种蛋疼兼容性问题在IE6独占天下的时候是不存在的。那时候的Web前端也是很美好的。
然而,之后的发展越来越出乎大家的意料。
首先,是硬件性能和网速的提升。提升到了可以输入一个网址就打开一个应用,无需等待太长时间,而且硬件性能跟得上,试问在这种情况下,为什么还要用客户端呢?而且web有着随时更新的巨大优势。
所以之后的发展