十年WEB技术发展历程

Ajax

03年的时候我上六年级。那时候网吧刚在小县城的角落萌生。传奇,大话西游第一代网游一时风靡。我抱着试一试的心态给了网吧老板两块钱想申请个号玩玩,然后接下来的一个小时我一直在,注,冊,账。号。

彼时网吧用的512k的带宽,注冊的时候,填了一堆信息,提交。页面跳转,嘣。”您填写的信息有误,请重填”。然后跳转回注冊页面,以此循环。我如今时常想,假设当时ajax能普及开来。我就能够省2块钱了。

那么ajax是什么?

首先ajax是一种技术。

以往的网页交互方式。用户在点击一个button后,比方提交button,用户就要等待漫长的数据和server的交互,期间用户无法进行不论什么操作,仅仅能点根烟。而ajax所做的。就是在向server发送请求的时候,我们不必等待结果。而是能够同一时候做其它的事情,等到有了结果我们能够再来处理这个事。

事实上ajax技术早在1998年的时候就已经由微软实现了,然而直到2005年2月,Adaptive Path公司的Jesse James Garrett发表文章"Ajax: A New Approach to Web Applications"。人们读了后认为哎哟不错哦这个屌,这之后ajax才大规模普及开来。

ajax的出现,极大了提高了web的用户体验。

时至今日,即使国内IT发展再怎么落后。全部站点的登录注冊也已经实现了ajax交互。用户点填写完信息后,页面不用刷新就能够知道信息提交成功与否。哪错改哪。

另外ajax作为一种前后端分离的解决方式,也已经被国内大多数不非常low的公司所採用。也间接导致了php等网页脚本语言的衰落。

jQuery

早年的js编程,代码的效率是极其低下的。这点尤其体如今操作dom上。开发人员想要给一个button加入事件。要写长长一大段反复的代码去获取到这个button,再写长长一大段反复的代码去加入事件。

虽然老油条会将经常使用的操作封装起来,可是对于不会封装的新手,这无疑是非常痛苦的一件事,尤其再加上各种各样的兼容。

2006年,本着解救菜鸟,让他们do more的宗旨,jquery诞生。jQuery诞生的意义,一是对ie6 7 8 及各种割据一方的浏览器做好了兼容,二是极大简化了dom操作,使开发效率大大提升。jquery非常火爆。火爆的有些前端仅仅会写jquery而不会写原生js的程度。时至今日,说jquery write once。see everywhere已经不为过了。

jquery的还有一个意义(我认为)在于。它催化了人们对前端的兴趣与探索,相比linux。你用非常低的成本,就能够写出一个让不懂编程的妹子说欧巴你碉堡了的效果,让人们认为哎哟(又)不错哦这个屌。此后大量的类库和基于jquey的插件雨后春笋般诞生,前端行业歌舞升平欣欣向荣。网页开发进入一个新时代。

Chrome

天下武功出谷歌。

在ie6,7,8的时代里面,虽然Firefox也缓慢的挑战ie的地位。

但和2009年開始Google開始推广的chrome浏览器产生的颠覆性影响比起来,逊色非常多。

Chrome使用Apple的开源内核webkit,良好的设计标准和市场反应。促进浏览器高速迭代,让IE在windows10中彻底消失。

chrome浏览器的推出,将简化前端的入门程度又推进了一步。其自带的调试工具好用又无脑,我们能够利用其轻松的查看网络状态,载入顺序,进行断点调试等,同一时候谷歌的插件功能。又给开发人员提供了极大便利。

眼下chrome最新版開始採用blink内核,測试版本号中。已经能够对css3动画进行追踪和调试。

在我还没有想象到的时候。chrome已经实现了它。

一句话,没有chrome,就没有新中国。就仅仅能用firefox了。

GitHub

随着软件项目的迭代加快。项目版本号工具也不断的演进,经历CVS, SVN,GIT。

到眼下为止CVS差点儿相同已经从互联网行业慢慢消失,SVN作为文件和文档存储存在,由linux内核发明人Linus创建的版本号工具GIT如今作为代码版本号标准。Github依赖于git成为开发人员团队协作的社区!

到2015年1月github上已注冊的开发人员超过一千万,开源项目几千万。

当中2014中国研发者在github上增长最快。

你差点儿能够在上面找到一切你想要的代码…比方username..password..

OAUTH

OAuth1或OAuth2与以往的授权方式不同之处是OAUTH的授权不会使第三方触及到用户的帐号信息(如username与password)。
产生背景:最常见的服务场景,用户须要使用两个不同企业的服务。登录验证A企业。下载内容;然后登录验证B企业,上传内容到B企业服务。复杂又耗时。

不管是用户。还是A、B都会想要互通服务。这就产生了核实身份的需求。旧的username、password机制会造成A/B企业有权限查看甚至改动对方的用户资源。为了达到确认身份、服务互通。Google、Yahoo、Microsoft牵头促使OAuth1.0产生。

之后的OAuth2.0是各大互联网企业基于https安全的一次新规划。

眼下最常见的应用场景主要在授权登录上,如微信、qq、微博等等。

JSON

Json虽然是2001年就产生的标准,但被广泛应用是在2008年之后各种Ajax应用、iPhone、Android设备流行之后。旧的服务体系多是企业级,所以XML对java型的企业级服务定位故意。但对于流量限制,语义简单的API服务来说,XML庞大、冗余、不易学又占带宽。

去年我刚工作的时候,后台给我返回一个数组,没有发言权的我在是要遍历这个数组还是转化为json格式之间纠结了非常久。

Json的普及,从还有一个角度体现了web开发的一个优势。不管你后台是java ruby php还是python。你仅仅要给我一个json格式的接口。我就能撑起整个地球。

DJANGO&RAILS

敏捷开发打破了项目研发模式。在2010之后的WEB2.0时代,Html5盛行。前端工作被分离出去。PHP那种网页脚本的优势没那么明显,虽然在CMS和论坛模板上依旧有优势。Django和Rails的最大优势在于,他让个人或两三个的小团队。实现整套产品成为可能。以Instagram为例,最初两个pythonproject师用django高速实现了服务端的全部功能。在用户增长时。再将大訪问量和大数据量的服务独立出去。

虽然现实残酷,rails每况日下,IE8和rails谁先消失仅仅是先后问题。但其提供的解决方式还是被非常多后生所效仿。人们都会记得这朵昙花。

Bootstrap

2011年Twitter开源的网页端GUI框架。jquery兼容了不同浏览器的js部分,bootstrap则兼容了不同浏览器的css部分。甚至于说。作为一个后端开发。你无需了解css,无需前端,无需设计师,仅仅要看一看bootstrap的文档,就能够搭起一个美观慷慨的后台管理系统。常见相似的GUI框架还有zurb的foundation,google的materialize,百度也曾出过一个名为GMU的移动端框架。

就我个人来说,我并不喜欢这些gui框架,虽然他们简化了css,实现了一些非常炫酷的效果。虽然我在项目中也用到过这些,虽然我不想承认我是绿茶。

这些框架最大的缺点就是,千篇一律,全部的页面都是一个样子。一样的nav,一样的sidebar。一样的表单,连鼠标点上去放个光都一模一样。就像我假设长了三条腿(虽然确实长了三条腿)别人会说我非常别致让他们眼前一亮,但假设全部人都长了三条腿。web也就失去其魅力了。

还有一个缺点是臃肿,一个css就走100多k的流量,其js插件又大都依赖jquery。忍心么。

当然,其为了解决响应式提出的栅格化html的思想还是非常值得借鉴的。

IOS & ANDROID系统的普及

2009年之后IOS和Android的高速发展。导致WEB开发发生下面改变:
1. html5在移动浏览器上优先实现。Android和IOS设备全面支持html5、CSS3,加速了IE消失。
2. 上网随时随地发生。鼠标点击、内容繁复的网页越来越简洁,响应式设计高速流行。
3. APP和server交互大部分和网页一样基于HTTP协议,webapp。hybrid app的概念被提出。

关于webapp,这里简单说下web相比原生的优势。

  • 跨平台:常说的一次编译,到处执行
  • 免安装:打开浏览器。就能使用
  • 高速部署:升级仅仅需在server更新代码,而不像client须要更新版本号
  • 超链接:能够与其它站点互连。能够被搜索引擎检索

听起来刁刁的。这些优势却经不住推敲。

首先,不同系统的用户使用习惯是不同的,ios用户返回button习惯在左上角,而安卓用户却习惯在屏幕最下方的位置,产品经理问。那放在哪儿。

呵呵哒不知道。其次,以前看过一个调查报告。问用户更喜欢用client还是web端。

喜欢client的用户远远超过了web端。你问我喜欢什么,我也是喜欢client。你问我为什么,我认为比較有安全感吧,并且更新版本号让我认为非常爽,非常有存在感,让我知道我并没有被世界遗忘。让我知道你们产品在更新,在为我担心。另外超链接..我一个client要你seo干什么。这还没完,webapp的缺点还有一大把,最大的缺点莫过于没有GPU加速,想要实现一个复杂一些动画,真是要了浏览器亲命了。

其次网页是单线程的,载入dom时会堵塞js,导致的结果就是,卡。一卡就烦了,烦了就关了,用户减一。

而hybrid就不同了,hybrid app的意思是混合原生应用。将须要频繁更新的页面作为web放在远程更新。这是一个靠谱的解决方式。BAT有非常多案例,如微信公布的JS SDK。掌上百度和淘宝clientAndroid版。

当然这里边的坑有非常多,有机会。我把我踩过的坑讲给你们听。

NodeJS

我纠结了一会node属不属于前端范畴的问题。我认为是属于的。

解决高并发一直是后台哥哥们乐于讨论的问题,比方咱们的好近实时监控系统。理论上每一个连接都会生成一个新线程,每一个新线程可能须要 2 MB 配套内存。

在一个拥有 8 GB RAM 的系统上,理论上最大的并发连接数量是 4,000 个用户。

随着用户的增长,咱们希望监控程序支持很多其它用户,这样,就必须加入很多其它server。当然,这会添加业务成本。尤其是server成本。除了成本上升外。还有一个技术问题:用户可能针对每一个请求使用不同的server,因此。不论什么共享资源都必须在全部server之间共享,到这里,技术就到了瓶颈。

node诞生的初衷。就是为了解决问题。node解决问题的方法是:更改连接到server的方式。每一个连接发射一个在 Node 引擎的进程中执行的事件,而不是为每一个连接生成一个新的 OS 线程。并为其分配一些配套内存。

nodejs属于server端语言。在前后端分离这场圈地运动中是前端的一个有利武器,同一时候在前端自己主动化上也提供了大量的可编程工具(grunt,bower,gulp等),淘宝百度对nodejs的热度一直非常高,自然而然我认为这是一个趋势。

去年美团成立了美团酒店的团队,选择了node作为后台语言。圈走了后台大部分的工作。我在想,前端js加上node再加上对UI的技能需求,以后前端project师是不是该叫全端project师了。

BIG DATA

大数据大概是过去几年最火热的名词,我一大批同学听说数据挖掘年薪30万都嗷嗷嗷去做数据库了。
大多数时候,我们在谈大数据事实上都是在谈在海量数据下的数据挖掘、数据分析、智能推荐、实时分析等。不同公司的技术方案不同,我仅仅列两个国内成功的案例:
• 京东个性化电商,场景包含基于行为、偏好、地域、时间、好友关系等维度,向不同的用户推荐不同的产品,不同用户搜索产品排序也不同…
• 百度地图东莞8小时迁徙图。百度搜索智能提醒
• 360手机卫士,电话号码防骚扰功能是通过用户的地域、身份、骚扰趋势。将标记的2.56亿个电话号码选出1000个和用户关联度最高的,写入用户手机的10k的文本里,达到不联网不做不论什么网络交互的情况下,为用户防骚扰

HTML5+CSS3

这是这几年被说烂了的一个词,人人都在说HTML5。问HTML5是什么。他们也说不清楚,就是酷,就是炫,就是酷炫。

在我看来。HTML5仅仅是一个三人成虎的东西,它吸引的眼球远超过了它提供的功能。HTML5仅仅是提供了一些新的API,就等于一个app从1.0升级到2.0添加了附近的人功能而已。

并且其提供的API。也就是在移动端试一试水。在pc端由于兼容的问题,始终不能被明媒正娶。

pc端的开发还是以HTML4.0+CSS2为基准渐进增强。至于css3。它最被人关注的动画。也是flash玩剩下的东西。

移动端的飞速发展催化了HTML5的发展,HTML5的发展也促使各浏览器趋于标准化。

这条标准化路上,微信功不可没,1024,围住神经猫。淘宝十年。LEXUS NX这些融合了大量HTML5+CSS3元素的页面让人印象深刻。

此外,微软抛弃IE代号,开发edge,各大浏览器厂商的不断标准化,HTML5草案定稿,ES6草稿的不断实现与完好,前端之路看起来是一条京畿坦途,我充满期待。

未来

3D页游?WebOS? 虚拟现实?

最后,随着用户硬件性能的提升,网络带宽的越来越粗。传感系统。Retina,WebGL技术的日渐成熟。再加上O2O的蓬勃发展,上边这些会成为现实么?

转载于:https://www.cnblogs.com/blfbuaa/p/7142510.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/429093.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python之编写登陆接口

1.输入用户名密码; 2.认证成功后显示欢迎信息; 3.错误三次后,账号被锁定。 账号文件:user.txt 锁定文件:locked.txt 流程图如下: # -*- coding:utf-8 -*- # Author Caoxl import sysaccount_fileE:\user…

java符号引用 直接引用_Java -- JVM的符号引用和直接引用

Java -- JVM的符号引用和直接引用在JVM中类加载过程中,*在解析阶段,Java虚拟机会把类的二级制数据中的符号引用替换为直接引用。*1.符号引用(Symbolic References):符号引用以一组符号来描述所引用的目标,符号可以是任何形式的字面…

Arduino学习笔记24

指导学生编程练习转载于:https://www.cnblogs.com/guochaoxxl/p/7148006.html

好全的Android面试题

转载:http://www.jianshu.com/p/84ee896c3329 需求描述 各种新技术接触渠道比较狭窄, 面试没有底气。 常见面试知识点及回答没有较系统的准备,就业指导提供的资料没时间看,看了记不住。 面试没有经验, 不清楚面试前要做的各种准备、面试过程…

JavaSE--类加载器

参考:http://www.importnew.com/6581.html Java 编译器会为虚拟机转换源指令。虚拟机代码存储在以 .class 为扩展名的类文件中,每个类文件都包含某个类或者接口的定义和代码实现。这些类文件必须由一个程序进行解释,该程序能够将虚拟机的指令…

Linux下汇编语言学习笔记13 ---

这是17年暑假学习Linux汇编语言的笔记记录,参考书目为清华大学出版社 Jeff Duntemann著 梁晓辉译《汇编语言基于Linux环境》的书,喜欢看原版书的同学可以看《Assembly Language Step-By-Setp:Programming with Linux 3rd Edition》,非常感谢该…

java netbeans 教程_NetBeans 教程

NetBeans IDE Java 快速入门教程第一章本章通过指导您创建一个简单的 "Hello World" Java 控制台应用程序,简要介绍 NetBeans IDE 工作流。学习完本教程后,您将对如何在 IDE 中创建和运行应用程序有一个基本了解。学习完本教程所需的时间不到 …

几个python小程序

python小程序 1-100求和 1 def Sum(x, y):2 return xy3 print reduce(lambda x,y:xy,range(1,101))4 5 i 16 j 07 while i < 101:8 j i j9 i 1 10 print j View Code输出1-100之间的奇偶数1 i 1 2 a [] 3 while i < 100: 4 if i%2 0: 5 …

java输出a-z_有1-26个数字和a-z字母,用Java多线程实现先输出2和数字再输出2个字

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼public class Z extends Thread{char[] letters new char[]{a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z};public static void main(String[] args){Z z new Z();X x new X();x.start();z.start();}public void run()…

Linux下git使用

一、安装 本人使用的是centos 7&#xff0c;首先安装git 1.下载git&#xff1a;wget https://Github.com/Git/Git/archive/v2.3.0.tar.gz 2.下载之后解压&#xff1a;tar xvf v2.3.0.tar.gz 3.进入解押文件目录&#xff1a;cd git-2.3.0 4.依次运行如下命令&#xff1a; ./conf…

java 水表识别_一种水表数字的AI智能识别方法与流程

本发明涉及模式识别与人工智能技术领域&#xff0c;特别涉及一种直观的水表数字的AI智能识别方法。背景技术&#xff1a;深度学习在目标检测的应用发展迅速&#xff0c;在YOLO(You Only Look Once)之后又出现了升级版本YOLOv2&#xff0c;采用的是Darknet-19作为基础网络&#…

Summary Day30

1.内存管理 1.1 进程中的内存区域划分 代码区 仅仅读常理区 全局区 BSS 堆 栈 1.2 字符串存储形式之间的比較 字符指针&#xff0c;字符数组。字符动态内存 1.3 虚拟内存管理技术 Unix/Linux系统总的内存都是採用虚拟内存管理技术进行管理。即&#xff1a;每一个…

java装箱和拆箱_java自动装箱和拆箱

这个是jdk1.5以后才引入的新的内容&#xff0c;作为秉承发表是最好的记忆&#xff0c;毅然决定还是用一篇博客来代替我的记忆&#xff1a;java语言规范中说道&#xff1a;在许多情况下包装与解包装是由编译器自行完成的(在这种情况下包装成为装箱&#xff0c;解包装称为拆箱)&a…

java 插桩 工具_一个基于Eclipse的通用Java程序插桩工具.pdf

第38卷第7期 计算机科学 V01&#xff0e;38NO&#xff0e;7Science 20112011年7月 Computer July一个基于Eclipse的通用Java程序插桩工具郑晓梅(南京中医药大学信息技术学院 南京210046)(南京大学计算机软件新技术国家重点实验室 南京210093)摘要插桩技术作为一种有效理解程序动…

【FICO 汇率】汇率

汇率存储的表位TCURR 汇率维护的事务代码为&#xff1a;OB08 每一种货币汇率都有很多版本&#xff0c;按照时间有效性管理 汇率涉及的两种货币&#xff0c;第一个为从&#xff0c;第二个为到&#xff0c;一般换算比率都是1&#xff0c;但也有不是1的情况&#xff08;主要是换算…

java 新窗口跳转页面_Java web开发中页面跳转小技巧——跳转后新页面在新窗口打开...

最近学习Java web&#xff0c;在学习过程中想实现一个需求&#xff0c;就是在jsp页面跳转的时候&#xff0c;希望跳转后的新页面在新窗口中打开&#xff0c;而不是覆盖原来的页面&#xff0c;这个需求使我困惑了好长时间&#xff0c;后来通过大海捞针似的在网上寻找方法&#x…

分辨率到底是个什么概念?它和DPI之间是什么关系?

"分辨率"到底是个什么概念&#xff1f;它和DPI之间是什么关系&#xff1f; 分辨率&#xff1a;显示分辨率&#xff08;屏幕分辨率&#xff09;是屏幕图像的精密度&#xff0c;是指显示器所能显示的像素有多少。由于屏幕上的点、线和面都是由像素组成的&#xff0c;显…

mysql.w002_mysql简单例子

登陆数据库&#xff1a;mysql -u用户名 -p密码 -P端口 -h数据库地址‍‍‍‍‍‍修改mysql提示符&#xff1a;(仅本次连接有效)‍‍‍‍‍‍方法一&#xff1a;执行mysql -uroot -proot -prompt \h结果为&#xff1a;localhost方法二&#xff1a;进入mysql后&#xff0c;执行PR…

mysqli mysql的区别_phpmysqli和mysql区别详解

本文介绍下&#xff0c;php中有关mysqli与mysql类的一些区别&#xff0c;有需要的朋友&#xff0c;可以作个参考哦。一&#xff0c;PHP-MySQL 是 PHP 操作 MySQL 资料库最原始的 Extension &#xff0c;PHP-MySQLi 的 i 代表 Improvement &#xff0c;提更了相对进阶的功能。PD…

JQuery中的Deferred-详解和使用

首先&#xff0c;为什么要使用Deferred&#xff1f; 先来看一段AJAX的代码&#xff1a; 1 var data; 2 $.get(api/data, function(resp) { 3 data resp.data; 4 }); 5 doSomethingFancyWithData(data); View Code 这段代码极容易出问题&#xff0c;请…