精华内容
参与话题
问答
  • 前端技术

    千次阅读 2014-04-20 23:42:36
    随着互联网产业的爆炸式增长,与之伴生的Web前端技术也在历经洗礼和蜕变。尤其是近几年随着移动终端的发展,越来越多的人开始投身或转行至新领域,这更为当今的IT产业注入了新的活力。尽管Web前端技术诞生至今时日并...
    
    

    随着互联网产业的爆炸式增长,与之伴生的Web前端技术也在历经洗礼和蜕变。尤其是近几年随着移动终端的发展,越来越多的人开始投身或转行至新领域,这更为当今的IT产业注入了新的活力。尽管Web前端技术诞生至今时日并不长,但随着Web技术的逐渐深入,今后将会在以下几方面发力。

    1. Web移动终端开发。
    2. JavaScript的兄弟们。
    3. 百花齐放的类库和框架。
    4. 工程化的Web前端开发规范。

    Web移动终端开发

    PhoneGap: 一个开源的开发框架,使用HTML、CSS和JavaScript来构建跨平台的移动应用程序。它使开发者能够利用iPhone、Android、 Palm、Symbian、BlackBerry、Windows Phone和Bada等智能手机的核心功能,包括地理定位、加速器、联系人、声音和振动等。除了在本地编译应用之外,还可以使用PhoneGap提供的云 端Build工具进行应用编译。也就是说,只需要将用HTML5写好的应用上传到PhoneGap的云端服务器,PhoneGap Build即可将其编译成适合不同平台的应用。

    Sencha Touch:说到这里,就不得不提一些面向移动端的WebUI库,毕竟PhoneGap是一个工具,要想基于Web技术构建完整的App,必须选择一些适 用的移动UI库。而最值得一提的是Sencha Touch,它可以让Web App看起来像Native App。美丽的用户界面组件和丰富的数据管理,全部基于最新的HTML5和CSS3的Web标准,全面兼容Android和iOS设备。PhoneGap 昭示着一种开发趋势,即App也可以使用Web前端技术来完成。而作为开发者最常用的UI工具箱,Sencha Touch又进一步加速了这种趋势,目前在淘宝已有大量的项目采用这种思路来搭建,即在内置应用的外壳加上自定义的基于移动Web的UI库。相信在未来这 种模式必会越来越流行。

    Media Queries:在CSS2时代,如果你曾经为网站设计过打印版CSS,那么就会明白CSS3 Media Queries的作用。不过,CSS3的Media Queries比CSS2的Media Type更实用,因为CSS2 的Media Type并不曾被多少设备支持过。CSS3的Media Queries可以获取这些数据:浏览器窗口的宽和高、设备的宽和高、设备的手持方向(横向还是竖向)和分辨率等。也就是说,Media Queries提供了一种基于不同的平台写CSS的技术。这项技术在2011年初被推广开来,至今已非常火热,尤其是在Web页面仍占互联网流量大多数的 今天,这种兼容技术能很快让网站兼容移动设备,保证产品实现最快的跨平台的兼容性和多平台的可用性。

    Zepto.js:一个专为 Mobile WebKit浏览器(如Safari和Chrome)而开发的JavaScript框架。它标榜自己简约的开发理念能够帮助开发人员简单、快速地完成开发 交付任务。更重要的是这个JavaScript框架是超轻量级的,只有5KB。Zepto.js的语法借鉴且兼容jQuery。目前已有不少网站开始基于 Zepto.js做应用,因为在抛弃了IE浏览器的兼容性问题后,Web开发会变得越来越纯粹,体积更轻巧,编码也更加愉悦。不可否认,随着移动终端开发 越来越流行,Zepto.js在未来将会有更加广阔的应用场景和空间。

    Bootstrap:Twitter推出的一个开源的用于前端开发的工具包。它由Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。Bootstrap提供了优雅的HTML和CSS规范,由动态CSS语言LESS写成,与CSS 框架Blueprint存在很多相似之处。Bootstrap一经推出便颇受欢迎,一直是GitHub上的热门开源项目,NASA和MSNBC的 Breaking News都使用了该项目。2012年第二季度,Bootstrap发布了2.0版,Bootstrap 2.0的一个重大改进是添加了响应设计特性,在1.0中,这是让很多开发人员抱怨的地方。而且为了提供更好的针对移动设备的响应式设计方 案,Bootstrap 2.0采用了更为灵活的12栏网格布局。此外,它还更新了一些进度栏及可定制的图片缩略图,并增加了一些新样式。值得关注的是,Bootstrap是一个 非常轻量级的框架,2.0在压缩后只有10KB。Bootstrap为我们的网站快速搭建提供了不错的工具和思路,这个工具集将拥有更旺盛的生命力。

    JavaScript的兄弟们

    CoffeeScript 是一个借鉴Ruby编写的新编程语言,创建者Jeremy Ashkenas戏称它是JavaScript的低调的小兄弟,因为CoffeeScript会将Ruby编译成JavaScript,而且大部分结构都 相似。但不同的是,CoffeeScript拥有更严格的语法。它的最大功绩就是将JavaScript硬绑的C/Java语法抛弃了,改为采用类似 Ruby/Python的语法。Ruby/Python本来就是深受Lisp影响的,与JavaScript算是同门师兄,它们的语法经过了实践考验,非 常适合函数式编程。这种优雅的语言独具魅力,即将面世的2013版的淘宝首页即采用了CoffeeScript实现。

    TypeScript 是微软开发的JavaScript的超集,TypeScript兼容JavaScript,可以载入JavaScript代码然后运行。与 JavaScript相比,TypeScript进步的地方在于:加入注释,让编译器理解所支持的对象和函数,编译器会移除注释,不会增加开销;增加一个 完整的类结构,使之更像是传统的面向对象语言。由于JavaScript只是一个脚本语言,并非用于开发大型Web应用,所以没有提供类和模块的概念。而 TypeScript扩展了JavaScript实现了这些特性,能更好地支持大规模JavaScript应用开发,吸引了不开发者。但要注意,虽然 TypeScript有微软做后盾看起来很有保证,但目前提供的只是早期的预览版本,TypeScript并不像它的网站看起来那样精美,最终版本可能会 在一年后ECMAScript 6发布会确定,现在的版本只是个开发预览版。因此,TypeScript今后发展如何,还需要进一步观察。

    此外,在服务器端,Node.js越来越流行。如今Node.js不仅作为处理高并发请求的中间层解决方案,还因其灵活的语法和丰富的底层API,越来越多 的人开始用它来写工具,尤其是之前基于Ant或者Java的一些工具如今都有了Node.js的版本。

    如此看来,Node.js在命令行工具领域有着更加 广阔的应用场景,甚至可以代替Perl或者Ruby这些传统的动态语言。在淘宝Node.js已有非常多的应用场景,例如在数据部门,Node.js被用 作处理高并发场景下的容池,专门吸收高并发的请求,甚至能够保持和客户端的长链接,而这在之前则需要花费很高昂的成本,例如Comet技术等。此外,淘宝 的开源前端类库KISSY也可以直接运行于Node.js环境,这样就可以在命令行运行KISSY代码,很多前端代码就有机会采用自动化测试等,提高生产 效率。再者,淘宝内部的开发工具链也已大部分采用Node.js来构建了。

    百花齐放的类库和框架

    SeaJS是由支付宝前端高级技术专家王保平(玉伯)开发的一个遵循CMD规范的模块加载框架,可用来轻松愉悦地加载任意JavaScript模块和CSS模块。 SeaJS非常小巧,小巧在于其压缩后体积只有4KB,而且接口和方法也非常少。SeaJS有两个核心:模块的定义和模块的加载。SeaJS可以加载任意 JavaScript模块和CSS模块,能保证你在使用一个模块时,已将所依赖的其他模块载入脚本运行环境中。SeaJS可以让你享受写代码的乐趣,不用 去管那些加载的问题。毕竟现在网页的可维护性和性能问题一样严峻,体现在:文件太多,不利于维护,前端后端都一样;HTTP请求过多,当然这个可以通过合 并解决,但如果没有后端直接合并,那么人工成本会非常大。用SeaJS就能非常好地解决这些问题。SeaJS遵循CMD规范,因此可以很方便地书写模块。 目前已经有越来越多的人采用CMD规范来开发项目了。

    最近微软已经正式发布了Windows 8操作系统,Windows操作系统的风格已经完全变成了磁贴状的Metro UI。对于微软来说,这是一个巨大的改变,而且所有微软的平台包括桌面、平板、移动端及其网站都使用这个UI风格。Metro UI CSS是一个非常完整的创建Metro风格的网站框架。它自成体系,但也可以与其他框架一起使用。使用LESS创建,并且拥有网格系统、排版样式、表格、 按钮和图片。同时也拥有内建的JavaScript组件,帮助你生成片状、菜单、边栏、进度条和提示等,是一个非常好用的框架。随着Windows 8的进一步流行,这种风格的CSS类库一定会成为一种趋势。

    Hype是一个小巧的工具,是Mac App Store新上架的一个HTML5创作工具,其长处是可以在网页上做出悦目的动画效果,无须Flash插件。开发该应用的公司Tumult由两个前苹果工 程师创建,并获得了Y Combinator的投资。由于公司的联合创始人之一Jonathan Deutsch曾担任Mail.app后端的技术主管,因此他在接受Paul Hontz的The Startup Foundry访谈时,谈到公司创始是为了解决HTML5创作工具缺乏的问题。可以说,Hype是第一个可用的创作HTML5产品的可视化工具,具有里程 碑式的意义。随着硬件性能提升,HTML5的应用程序更加倾向于被工具生成,而不像传统意义上由工程师“切”出来。因此工具化是一个方向,不管HTML5 是否真的能在移动终端扎下脚跟,这种方向是值得坚持的。毕竟,HTML5的应用开发现在还处于原始社会。

    iScroll.js是使用原生 JavaScript编写的一个模拟滚动效果的小类库,不依赖于任何JavaScript框架。旨在解决移动WebKit系浏览器的区域滚动问题,兼容 Mobile Safari、Android默认浏览器、Safari、Chrome、Firefox5+、Opera11+、IE9+及其他WebKit核心浏览器。 最新版本为iScroll4。这个小库一问世就备受关注,因为它不仅可以在PC端完美模拟滚动效果,在移动终端里对触屏事件的支持也堪称完美。

    iScroll4 是2011年底问世的,2012年在移动终端产品开发中大放异彩,在淘宝的诸多产品中都用到了这个JavaScript库。iScroll是小而精的经典 作品,名字也带着苹果范儿。但美中不足的是,只能使用ID调用。不过这个小特性不是什么大问题,可以通过二次封装来解决。期待iScroll4在移动终端 里有更多精彩的表现。

    前端MVC在2011年是比较火的话题,随着越来越多的人开始尝试使用诸如JavaScript MVC和Backbone.js这些MVC类库,更多的产品也看起来更像“软件”而非“网页”。但由于前端环境的复杂性,我们也渐渐发现“这种”MVC并 非完美,只能应用于“基于数据驱动”的场景,而对“基于事件驱动”的场景却没有太好的解决办法。目前,淘宝有很多产品在尝试使用“有限自动机”来弥补 MVC在这方面的不足。因此,新场景下的MVC还需要更深入的提炼。

    工程化的Web前端开发规范

    2012 年,关于前端开发编码规范的讨论愈来愈多。国外和国内的顶尖开发者几乎同时对编码规范产生了很大兴趣,前Yahoo!首页首席前端工程师N.C. Zakas在他那本《高可维护的JavaScript》书中也提到规范在团队协作过程中的重要性。而如下这两个方面,是值得我们探讨和深思的。

    AMD 与CMD规范之争,随着CommonJS的进一步普及,CommonJS规范在标准的模块开发领域发挥着越来越重要的作用,而CommonJS在浏览器端 的难以实现却为这份规范增添了一丝变数。本质上讲,CommonJS是一种用于同步加载JavaScript代码的API规范,非常简单优雅。为了在浏览器端实现这种机制,则不得不加入了一层异步回调,这便是AMD(Modules/Asynchronous-Definition)。RequireJS 实现了这个规范,而Dojo也将马上完全支持(Dojo1.6)。规范本身非常简单,甚至只包含了一个API。玉伯在开发SeaJS的过程中,更多地保持 了CommonJS Modules规范的风格,即CMD(Common Module Definition)。较之AMD,CMD没有采用单一的API来适用于多个功能,而是根据不同功能定义不同的API。我认为,两者在完备性上是基本一 致的,但在社区理念和编程风格上有所差异,开发者可以根据自己的偏好来选择使用AMD还是CMD编程风格。

    Java语言编码 规范对于前端开发编程规范有非常大的影响。在Zakas的《高可维护性JavaScript》一书中提到了五种JavaScript编程规范,都和 Java语言编码规范有着类似的渊源:Crockford编程规范、 jQuery核心风格指南、SproutCore编程风格指南、Google的JavaScript风格指南和Dojo编程风格指南。不管是哪种规范,都 强调了编码风格一致的重要性,这也可看出,前端团队开发越来越看重规范,JavaScript的灵活性需要某种程度的限制。

    总之,通过上面的阐述,我们可以看到前端技术的不断进步和推陈出新,也能够体会到项目过程的工程化,解决方案的轻量化,库和框架的多元化,知识结构的体系化,这种趋势在今后会变得越来越明显,也昭示着前端技术的发展方向。

    说 到前端技术知识结构的体系化建设,这是我这些年来一直都在做的事情,在2011年也画了一张图来说明我的观点——前端技术体系的建设是一项长期的任务。毕 竟前端新技术新知识层出不穷,对于经典的知识结构的整理也很有挑战性,但这项工作终究需要有人去做,为新入道的人指出一个大致的方向。对于前端工程师的成 长问题,我也写过一篇长文“前端开发十日谈”,帮助新人们解惑。

    非常感谢朴灵,已经将这个知识结构新建了一个开源项目(http://github.com/JacksonTian/fks),也希望大家一起参与进来,为前端技术知识体系建设做出贡献。


    展开全文
  • React风格的企业前端技术

    千人学习 2016-12-07 16:53:05
    React视频教程,本次分享将围绕如何打造react风格的前端项目展开,重点介绍当下流行的前端项目的工作流,react、angular等火热的前端框架,karma、Mocha等流行的前端单元测试框架,用户体验、性能优化等。
  • 2019前端技术栈梳理

    2019-09-23 15:43:03
    2016年前端技术观察 2019前端技术栈参考图 图中关于前端技术栈主要分为三个阶段: 1. 前端基本功HTML、CSS、JavaScript 2. 前端模块化、工具化 3. 前端的深入学习 比熊很赞同曹刘阳老师在2016年前端技术观察里提到...

    首先Mark住值得参考的资料

    1. 一个关于前端、后端和运维roadmap的网站
    2. 2016年前端技术观察

    2019前端技术栈参考图
    前端
    图中关于前端技术栈主要分为三个阶段:

    1. 前端基本功HTML、CSS、JavaScript
    2. 前端模块化、工具化
    3. 前端的深入学习

    比熊很赞同曹刘阳老师在2016年前端技术观察里提到的学好前端自己领域的知识,专一门,再去扩展其它领域知识。近几年前端技术更新速度惊人,导致初学者在学习过程中形似而神离,搞不清本质;所以小目标是在2019年结束前做一遍梳理,之后的文章会尽可能涉及到技术栈里的每部分内容。

    文章内容准确性和正确性上可能会出现偏差,望前辈指正。今后在不断深入的过程中也会对历史文章进行补充和修正。

    手工雪花酥,一个前端姑娘值得骄傲的副业

    展开全文
  • ​ 最近几年,越来越多的人投入到...​ 真正了解前端技术的工程师都会感觉前端技术发展变化太快。浏览器特性、前端框架、前端工具、多终端浏览器等都在快速迭代中。作为前端工程师不仅要掌握现有的技术去实现业务需求

    ​ 最近几年,越来越多的人投入到前端大军中;时至至今,前端工程师的数量仍然不能满足企业的发展需求;与此同时,互联网应用场景的复杂化提高了对前端工程师能力的要求,一部分初期前端工程师并不能胜任企业的工作,优秀的前端工程师一难求。

    ​ 真正了解前端技术的工程师都会感觉前端技术发展变化太快。浏览器特性、前端框架、前端工具、多终端浏览器等都在快速迭代中。作为前端工程师不仅要掌握现有的技术去实现业务需求,更要不断的学习新的技术、新的理念,时刻准备着新技术浪潮的来临。

    ​ 《现代前端技术解析》提及了作为一个前端工程师需要了解的大部分技能。介绍了从直接性DOM交互框架>>MVC>>MVP>>MVVM>>Virtual DOM>>MNV*等框架演变和实现原理;讲解了前端大型项目实现的思路;引出了前后端同构、Hybrid离线包以及增量更新关键技术的设计思路;并对未来前端趋势做了相关分析和展望。

    Web前端技术基础

    ​ 前端开发模式先后经历了静态黄页时期、服务器组装动态网页数据时期、后端为主的MVC(Model-View-Controller)模式时期、前后端分离方案开发时期、纯前端MV*(Model-View-*,数据模型、视图、控制方式分离)时期、最后进入到虚拟DOM时期、MNV*(Model-NativeView-*)时期以及前后端同构的开发时期。

    现代Web前端技术发展概述

    ​ 随着越来越多的业务搬到前端实现、前端的代码量越来越多。应运而生的是采用代码管理中分治思想模块化和组件化的出现,将复杂的代码结构拆分成多个对立、简单、解耦合的结构或文件分开管理,使项目结构更加清晰;同时限制首页资源、利用缓存以及局部请求的方式来使用户更快更流畅的使用。

    然而,对于移动端我们往往需要考虑更多的限制因素,移动端的劣势:

    • 移动端设备计算资源和网络资源比较有限;
    • 移动端CPU处理速度较慢且网络速度也相对较慢,解析和加载同样的内容需要更长的时间;
    • 移动端浏览器受屏幕大小限制,一次性展示的内容有限;
    • 移动端设备通常没有键盘和鼠标等外接设备,用户交互难度大;
    • 移动端整体性能比PC端要差。

    JavaScript在Node.js(Node.js是一个基于Chrome V8引擎的JavaScript运行环境,使用了事件驱动、非阻塞式I/O的模型,使其轻量又高效,它使用的包管理器为npm,是目前全球最大的开源生态系统)服务端也可进行高效的开发,使前后端同构变得可行。

    ​Web前端技术一直以效率和质量为最终导向的道路上探索前进!

    浏览器应用基础

    ​ 通常认为浏览器主要由:用户界面、网络、JavaScript引擎、渲染引擎、UI后端、JavaScript解释器和持久化数据存储七部分组成。浏览器内核往往指的是渲染引擎。

    常见的浏览器内核

    • Trident内核:IE、360浏览器、搜狗浏览器等
    • Gecko内核:Netscape6及以上版本、Firefox、SeaMonkey等;
    • Webkit内核:Safari、Chrome;
    • Blink内核:Webkit一个分支,优化了一些新特性,移动端较多浏览器采用该内核。
      浏览器组成结构

    浏览器渲染引擎工作流程:
    浏览器渲染引擎工作流程

    ​ 渲染引擎对DOM渲染树的解析和输出是逐行进行的,内容越靠前越优先展示,所以为了确保用户体验,通常不要将script脚本插入到HTML显示内容区域,因为script内容的解析执行会阻塞页面结构的渲染

    ​ 整个过程中,要关注的是渲染树布局和绘制阶段:页面生成后,如果页面位置(position、float、margin等属性)发生变化,就要从布局阶段开始重新渲染,即页面重排页面重排一定会进行后续重绘。如果页面元素只显示样式改变而布局不变,那么页面内容将从绘制阶段开始,即重绘。所以,需要尽可能的避免页面重排,并减少页面元素的重绘

    HTML文档解析

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8">
        <title>页面标题</title>
      </head>
      <body>
        <div>
          <p>页面内容</p>
        </div>
      </body>
    </html>

    HTML文档解析图

    let element = document.getElementById('id'),
        type = Object.prototype.toString.call(element).slice(8, -1);
    console.log(type); // HTMLDivElement

    CSS解析

    html, body{
      margin: 0;
      color: red;
    }
    header, section, footer {
      margin-top: 10px;
    }

    CSS文档解析图

    在已经形成的DOM渲染树中,节点的CSS规则可以通过document.defaultView.getComputedStyle(element, null)方法来获取查看。

    补充:样式规则的权重计算方式

    样式规则 权重
    !important 最高
    内联 1000
    id 100
    .class 10
    name 1

    例如:

    /* 100 + 10 + 1 = 111*/
    body #content .btn {
      color: yellow;
    }
    /* 100 + 10 = 110*/
    #content .btn {
      color: red;
    }
    /* 100 + 1 = 101 */
    #content button {
      color: blue;
    }

    权重更高的样式规则生效,最终button按钮展示未黄色。

    document.defaultView.getComputedStyle(element)获取元素CSS规则。

    浏览器数据持久化存储技术

    ​ 打开Chrome浏览器调试模式,Application左侧列举了现代浏览器的8种缓存机制HTTP文件缓存、localStorage、sessionStorage、indexDB、Web SQL、Cookie、CacheStorage、Application Cache,以及不常用的Flash缓存。

    HTTP文件缓存

    HTTP文件缓存是基于HTTP协议的浏览器文件级缓存技术。详情请查看: 【HTTP】缓存
    这里写图片描述
    1. Cache-Control:相对时间(秒为单位)(或者,Expires:绝对时间)如果未过期,直接读取浏览器缓存文件,不发生任何HTTP请求。
    2. 在浏览器端判断上次返回头中是否包含Etag信息,有则连同If-None-Match一起向服务器端发送条件Get请求,304说明未做过修改,如果是200需要进入下一步;
    3. 在浏览器端判断上次返回头中是否包含Last-Modify信息,有则连同If-Modified-Since一起向服务器端发送条件Get请求,内容失效返回200,否则304;
    4. 如果Etag和Last-Modify都不存在,直接向服务器请求。

    注意:如果返回304,不会有内容,节省请求大小!

    localStorage

    【受到同源策略影响】、【以及在safari下问题】、【常规解决方案代码】请查看八种方式实现跨域请求
    单个localStorage的大小受限,可以用多个iframe方式使用多个域名来突破单个页面下localStorage存储数据的最大限制。特别说明,浏览器多个标签页打开同个域名时,localStorage内容一般是共享的。其位置这可以监听事件“storage”来做一致性操作响应处理。这样会导致一种现象如下:

    标签页一:通过某行为修改localStorage中某个属性值,然后数据接口依赖该属性值;
    标签页二:由于localStorage标签页间共享,导致标签页二数据不准确!

    sessionStorage

    和localStorage功能类似,但是sessionStorage在浏览器关闭时会自动清空。

    Cookie为了辨别用户身份(参见,客户端识别与cookie机制)或Session跟踪而存储在用户浏览器端的数据。Cookie一般会通过HTTP请求发送给服务器端。
    Cookie分为:Session Cookie和持久型Cookie。Cookie设置中有个HttpOnly参数,前端浏览器使用document.cookie是读取不到HttpOnly类型的Cookie的,被设置为HttpOnly的Cookie记录只能通过HTTP请求头发送到服务器端进行读写操作,这样就避免了服务器的Cookie记录被前端javascript修改,保证了服务器验证Cookie的安全性。

    其他

    • WebSQL:二维表的形成存储大量数据到客户端,但目前只有Chrome浏览器有。
    • IndexDB:在客户端存储大量结构化数据并且在这些数据上使用索引进行高性能检索的一套API,类似于NoSQL。
    • Application Cache:通过manifest配置文件在本地有选择性地存储javascript、css、图片等静态资源文件的文件缓存机制,已废弃。
    • cacheStorage:在ServiceWorker规范中定义的,用于保存每个ServiceWorker(后续博文会单独介绍)声明的Cache对象,未来可能替代Application Cache的离线方案。
    • Flash缓存:主要基于Flash,具有读写浏览器本地目录的功能。

    号外:chrome://chrome-urls/可以列出Chrome的所有URL;使用安卓手机打开Chrome,在桌面Chrome中输入chrome://inspect/#devices可以连接手机进行调试。

    展开全文
  • Vue前端技术

    2019-10-31 17:16:28
    TIP 前端技术栈 ES6、vue、vuex、vue-router、vue-cli、axios、element-ui 后端技术栈SpringBoot、MyBatis、Spring Security、Jwt

       TIP

    • 前端技术栈  ES6、vue、vuex、vue-router、vue-cli、axios、element-ui
    • 后端技术栈  SpringBoot、MyBatis、Spring Security、Jwt

    展开全文
  • 现代前端技术解析:前端跨站技术

    千次阅读 2017-08-03 20:59:01
    前端跨站技术随着前端技术栈在服务端和移动端上的尝试和日益成熟,前端工程师的追求绝不只是页面上的技术,如何实现跨服务端,如何扩展到移动端开发将变成主要讨论议题。JavaScript跨后端实现技术前端通过与Node...
  • 特别高的薪资都是直接技术面试或者是 现场编程 总结很多人的面试题,后期会对于单个知识点再说笔记详细讲解。 部分都是百度的答案,不是特全面的,可以自己找下 同时分享一个自己录制的CSS3动画特效经典案例...
  • 前端项目与技术实践前端开发规范HTML规范head内容​ head中必须定义title、keyword、description,保证基本的SEO页面关键字和内容描述。移动端页面head要添加viewport控制页面不缩放,有利于提高页面渲染性能。建议...
  • 前端技术前沿10

    千次阅读 2019-05-26 11:50:55
    允许用户从NPM服务器下载别人编写的第三方包到本地使用。 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。 通过 npm 命令来升级 ...
  • 前端技术前沿9

    2019-05-24 23:57:50
    Node.js使用Module模块去划分不同的功能,以简化应用的开发。 var myModule = require('./myModule.js'); 将某些方法和变量暴露到模块外,可以使用exports对象去实现。 安装 Linux 下 Node.js的安装 ...
  • 现代前端交互框架​ Web前端页面的开发避免不了与DOM的交互操作。前端框架的一次次变化,从提升效率的阶段,慢慢走向改善性能的阶段。直接DOM操作时代对于开发者来说,所有数据内容都可以通过DOM结构来组织和展示的...
  • Web前端开发高级前端技术(高级开发程序篇)

    千次阅读 多人点赞 2020-01-27 01:56:18
    (给达达前端加星标,提升前端技能)内容有点多,也请你静下来,慢阅读,今后多多关照。说到web前端开发高级,必须要掌握的是HTML和css代码的优化,前端优化很重要,这是成功你进阶的道路上...
  • 现在的Web前端应用已经不是简单的三层结构就能轻松解决,而是已经形成了编译流程化、生产环境基础优化结构运行的模式。HTML结构层必须要知道的DOCTYPEHTML4.01是基于SGML(Standard Generalized Markup language,...
  • 2016年前端技术观察

    千次阅读 2016-12-14 14:58:31
    前端技术,从最初的刀耕火种到现在的百花齐放、繁花迷眼,可以说达到了一个前所未有的鼎盛时期。当身边的同事张口闭口都是所谓H5的时候,作为一名前端开发者的我心中越来越多的却是迷惑和不解。 我并不完全赞同这篇...
  • 最近比较关注前端技术

    千次阅读 2016-01-22 22:39:05
    前端技术包括4个部分:前端美工、浏览器兼容、CSS、HTML“传统”技术与Adobe AIR、Google Gears,以及概念性较强的交互式设计,艺术性较强的视觉设计等等. Web前端优化 尽量减少HTTP请求 (Make Fewer HTTP Requests...
  • 经验分享:如何系统学习 Web 前端技术

    万次阅读 多人点赞 2017-10-30 16:33:18
    抛开具体技术细节,先主要谈谈程序员如何更高效的,有选择的学习技术。我能体会到选择的轻松和乐趣,体会到身为技术人员和人类的平衡感。字里行间中,我要表达的是一种放弃与选择的哲学,能品到这一点,我就很高兴。
  • Web前端技术栈(送VUE)

    千人学习 2019-08-06 11:56:48
    本课程讲解了VUE技术栈中的各种... 通过本课程的学习,大家可以学习到VUE技术栈中的各种技术,并且可以完整的掌握从发出请求,到前端处理数据,再到模拟后台数据等整个web前端的开发流程。 课堂手绘图(部分) 
  • 前端技术简介

    千次阅读 2016-10-18 16:08:09
    在HTML入门教程学习之前,我们有必要跟大家讲一下网站开发的一些知识。了解这些知识,对你以后网站开发之路如何走、该学习些什么,是非常有用的。同时也避免你走太多的弯路。
  • 上周六有幸参加了在杭州阿里巴巴西溪园区举办的2014年D2前端技术论坛和晚上的酒会,实地感受了一下阿里巴巴前端开发的技术氛围和影响力,总体上看这次D2规模还是挺大的,国内前端的知名大牛基本上都到了。...
  • 前端技术

    千次阅读 2018-06-05 15:11:02
    # 欢迎使用Markdown编辑器写博客
  • 【Python全栈】第四周 Web前端技术

    千人学习 2019-01-31 17:34:33
    本周课程主要讲解Web开发中的Web前端技术,其中包括HTML标记语言和CSS层叠样式表。通过对常用HTML标签、CSS选择器及部分常用属性的学习,为我们后面的Python Web开发和网络爬虫等模块做好准备。

空空如也

1 2 3 4 5 ... 20
收藏数 51,436
精华内容 20,574
关键字:

前端技术