zoukankan      html  css  js  c++  java
  • 关于前端那些事

    这两天由于项目原因要求前端处理图片,对图片进行各种折腾,还要效率高,兼容性好,于是一直在看js,html5,css3的内容,

    说实话之前很少搞前端,顶多用js写写验证,做个跳转什么的,Jquery都用的少,这可难为人了。

    以下内容很乱,但是花了今天一上午的时间,总得记录点什么吧。

    1:chrome 参考 safari 都使用了开源的webkit,但chrome试用了自己的javascript 引擎-V8 ,啥叫引擎,就是将js代码编译,执行的容器,和JVM一样。

    听说chrome再次将webkit精简->Blink,微信浏览器更新成了Blink内核,提供了更强大的HTML5和CSS3支持。

    因此类似这种写法 obj.style.webkitTransform chrome和safari都支持的。

    2:顺便了解了一下V8的高性能的背后,具体参考http://blog.csdn.net/horkychen/article/details/7761199 貌似这篇文章是日本工程师写的,就是很详细很好懂啦,

    V8还可以作为动态链接库直接实现像Java+JNI+C++那种互调的功能,很强大有没有。

    那,提到V8,不得不说下Node.js,不是说了他就是个javascript的VM么,但NodeJS并不是提供简单的封装,然后提供API调用,如果是这样的话那么它就不会有现在这么火了。Node对一些特殊用例进行了优化,提供了替代的API,使得V8在非浏览器环境下运行得更好。例如,在服务器环境中,处理二进制数据通常是必不可少的,但Javascript对此支持不足,因此,V8.Node增加了Buffer类,方便并且高效地 处理二进制数据。因此,Node不仅仅简单的使用了V8,还对其进行了优化,使其在各环境下更加给力。

    Node.js有以下优点:

     1、基于V8虚拟机,可构建高性能服务器

           V8引擎本身使用了一些最新的编译技术。这使得用Javascript这类脚本语言编写出来的代码与用C这类高级语言写出来的代码性能相差无几,却节省了开发成本。对性能的苛求是Node的一个关键因素。 Javascript是一个事件驱动语言,Node利用了这个优点,编写出可扩展性高的服务器。Node采用了一个称为“事件循环(event loop)”的架构,使得编写可扩展性高的服务器变得既容易又安全。提高服务器性能的技巧有多种多样。Node选择了一种既能提高性能,又能减低开发复杂度的架构。这是一个非常重要的特性。并发编程通常很复杂且布满地雷。Node绕过了这些,但仍提供很好的性能。

          2、单线程

          Node.js可以在不新增额外线程的情况下,依然可以对任务进行并行处理 —— Node.js是单线程的。它通过事件轮询(event loop)来实现并行操作,对此,我们应该要充分利用这一点 —— 尽可能的避免阻塞操作,取而代之,多使用非阻塞操作。

          3、可利用Javascript进行后台开发

          虽然让Javascript运行于服务器端不是Node的独特之处,但却是其一强大功能。不得不承认,浏览器环境限制了我们选择编程语言的自由。任何服务器与日益复杂的浏览器客户端应用程序间共享代码的愿望只能通过Javascript来实现。虽然还存在其他一些支持Javascript在服务器端 运行的平台,但因为上述特性,Node发展迅猛,成为事实上的平台。

          4、非阻塞IO

          Node采用一系列“非阻塞”库来支持事件循环的方式。本质上就是为文件系统、数据库之类的资源提供接口。向文件系统发送一个请求时,无需等待硬盘(寻址并检索文件),硬盘准备好的时候非阻塞接口会通知Node。该模型以可扩展的方式简化了对慢资源的访问, 直观,易懂。尤其是对于熟悉onmouseover、onclick等DOM事件的用户,更有一种似曾相识的感觉。

          5、RESTFUL API

    解决阻塞可以引入事件处理机制解决这个问题,在查询请求发起之前注册数据加载事件的响应函数,请求发出之后立即将进程交出,而当数据返回后再触发这个事件并在预定好的事件响应函数中继续处理数据。而JavaScript,相对于其他语言,至少有两个关键特性决定它特别适合完成这个任务。

         (一) JavaScript是一种函数式编程语言,函数编程语言最重要的数学基础是λ演算(lambda calculus) ,即函数对象可以作为其他函数对象的输入(参数)和输出(返回值)。这个特性使得为事件指定回调函数变得很容易。特别是JavaScript还支持匿名函数,通过匿名函数的辅助,我们很容易实现回调。(二)JavaScript的另外一个重要语言特性:闭包(Closures)。该特性可以使异步回调的运行上下文保持,即"状态保持"。

    Node.js背后的V8引擎优化技术 戳这里-> http://www.iteye.com/news/31307

    3:还看了一下Javascript 中的神器——Promise,then的语法太优雅,有没有,具体参考http://www.jianshu.com/p/063f7e490e9a

    4:Css3的GPU加速,webGL的可以让前端直接调用OpenGL做图像处理 

    Three.js

    JavaScript编写的WebGL第三方库。提供了非常多的3D显示功能。Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包括了摄影机、光影、材质等各种对象。你可以在它的主页上看到许多精采的演示。不过,这款引擎目前还处在比较不成熟的开发阶段,其不够丰富的 API 以及匮乏的文档增加了初学者的学习难度(尤其是文档的匮乏)three.js的代码托管在github上面。

    关于2维3维计算机图形技术、Khronos Group对各种技术进行了标准化并制定了[OpenGL]、作为Windows、Mac、Linux上的一种跨平台技术并一直活跃着。 OpenGL 能够从任意视点出发,对三维空间中的物体进行二维投影的自动计算。 而且因为可以直接操作计算机的图形卡、OpenGL能够非常高速和高精度地描绘三维图像。2009年,Khronos Group把这样的OpenGL技术运用到WEB浏览器并制定了WebGL。WebGL 是 OpenGL 和 JavaScript 之间的结晶、HTML5 的 canvas 元素里、利用和OpenGL同样的API、可以绘制高精度的三维图像。 但问题也出来了,占有最大浏览器份额的InternetExplore反对采用WebGL。 因为一直以来 OpenGL 和 开发InternetExplore 的 Microsoft公司独自开发的三维图形API「DirectX」处于竞争者关系。 可因为 DirectX 只是 Microsoft 公司的产品、不能成为跨平台的选择、 而且在浏览器中描绘性能也没有超过WebGL的迹象、所以胜败已经是很明显的事情了。 关于WebGL的中需要注意的是、浏览器要支持WebGL、电脑中安装的图形显示卡中的OpenGL的版本必须要是2.0以上。

    具体可以参考以下link,

    http://www.hiwebgl.com/?p=1058

    这么看前端越来越重了,对于前端工程师来说也是好事,曾经复杂的功能现在底层就支持了,节约了不少宝贵时间~

  • 相关阅读:
    超简单解释TCP、UDP、HTTP
    亲身经历面试题总结
    面试最让你手足无措的一个问题:你的系统如何支撑高并发?
    什么是hadoop,hadoop可以做什么
    在.net Core中如何使用HTML5上传视频
    2018很废的一年
    SQL合集
    ASP.NET CORE 基础配置、Linux发包
    SQL获取本周,上周,本月,上月的开始时间和结束时间
    C# net Emgu.CV.World 人脸识别 根据照片将人脸抠图出来。
  • 原文地址:https://www.cnblogs.com/marszhw/p/5984782.html
Copyright © 2011-2022 走看看