热搜:NVER node 开发 php

前端技术集锦整理~持续更新_html/css_WEB-ITnose

2024-11-03 12:10:02
前端技术集锦整理~持续更新_html/css_WEB-ITnose

目的:广泛得了解前端工具,在项目中选择合适的前端工具进行开发,达到事半功倍的效果。

构建工具

Gulp 基于nodeJs,依靠不同的插件自动完成代码的压缩,合并,风格检查等操作。 类似的还有grunt, webpack

构建工具的插件

  • 代码压缩合并、图片压缩、MD5后缀
  • LESScss引入函数、嵌套等操作,方便CSS的开发与维护。类似的还有:SASS
  • Babel ES6/ES2015转ES5。es6介绍
  • CoffeeScript 以另一种更精简的语法来书写JS。类似的还有:TypeScript
  • artTemplate 模版引擎
  • RequireJs

  • 实现JS文件的异步加载(防止JS阻塞)
  • 管理模块之间的依赖性(严格保证js加载顺序)
  •  介绍, 文档

    MVC、MV*
    AngularJs, Backbone 适合单页面、交互复杂的web项目。

    DOM操作库

  • jQuery 适合PC端
  • zeptoJs 适合mobile
  • UI / 组件

    jQuery UI, Kissy, Bootstrap, pureCss

    icon font

    Font Awesome 一套字体图标,使用css来替代常用的图标/img。

    es5-shim.js

    使得旧版浏览器也能够兼容es5。

     es5-shim.js, es5介绍

    Hybrid App开发

  • 基于WebView: APPCAN, phonegap
  • 基于HTML5+ : MUI, Hbuilder
  • React Native
  • React

    以组件的方式进行开发

  • ReactJs 使用Virtual DOM(diff算法)缓解DOM操作缓慢与特效卡问题。
  • React Canvas 基于ReactJS与Canvas,进一步优化手机端网页特效。
  • React Native 用于开发IOS与Android应用。(1)理念:既拥有Native的用户体验、又保留React的开发效率;(2)learn once, write anywhere;(3)使用javascriptCore+自己开发的浏览器渲染引擎,而不是webview;(4)css-layout, JSX;
  • 代码管理

  • SVN 集中式
  • Git/Github 分布式
  •  两者对比