• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > 2015-2016前端架构体系技术精简版

2015-2016前端架构体系技术精简版

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含HTML5教程,HTML5中国,2015-2016前端架构体系技术精简版,html5cn,html5资料,html5文章等相关知识,匿名希望在学习及工作中可以帮助到您

  

  点击查看github高清图

  点击查看完整版

 一、框架与组件

  bootstrap等UI框架设计与实现

  伸缩布局:grid网格布局

  基础UI样式:元素reset、按钮、图片、菜单、表单

  组件UI样式:按钮组、字体图标、下拉菜单、输入框组、导航组、面包屑、分页、标签、轮播、弹出框、列表、多媒体、警告

  响应式布局:布局、结构、样式、媒体、javascript响应式

  第三方插件:插件管理

  jQuery、zepto使用原理以及插件开发

  支持amd、cmd、全局变量的模块化封装

  $.fn.method = function(){}

  mvc/mvvm框架原理设计,vue/angular/avalon等

  directive设计:html、text、class、html、attr、repeat、ref,可扩展

  filter设计:bool、upperCase、lowerCase,可扩展

  表达式设计:if-else等实现

  viewmodel结构设计:例如数据,元素,方法的挂载与作用域

  数据更变检测:函数触发,脏数据检测、对象hijacking

  polymer/angular2思想与设计思路

  import技术

  template和script引入方式

  css样式命名空间隔离

  简单复用第三方库

  reactjs原理与使用

  virtual dom单向数据绑定

  js执行语法方式

  UI由状态控制

  ......


  二、构建生态

  grunt/gulp开发环境任务编写

  文件处理插件:html、scss、js、image、font、其它

  优化插件:雪碧图、图片压缩、iconfont构建

  发布替换插件

  打包、压缩包插件:组件自动分析

  白名单配置

  自定义插件编写

  ......


  三、开发技巧与调试

  fiddler加willow基础组合调试

  常见配置与分析

  结合浏览器调试

  werien、vorlonjs远程调试,chrome inspect ?代码自动化检查fecs

  ......


  四、html、css与重构

  jpeg、webp、apng、bpg图片

  编码原理

  特点与优劣势

  适用场景

  iconfont使用与实现原理

  自动打包构建方法

  iconfont兼容性写法

  fonthello、fontawesome、icomoon.io、iconfont.cn线上工具

  页面响应式设计

  layout布局响应式

  html结构响应式

  css样式响应式

  image媒体响应式

  javascript响应式

  media query与平台判断

  css重置

  reset

  nomalize

  neat

  sass/compass/less/postcss常用语法与使用

  常用语法功能

  组件化UI设计管理

  构建工具实现方案

  雪碧图自动合成

  iconfont自动接入等等

  media query与常见页面尺寸了解

  媒体类型引入和媒体特性引入

  device-width适应

  retina屏幕适应

  em,rem原理与实现

  code4ui、code4app、初页、maka等

  前端dom操作即使刷新前端页面

  根据dom操作生成组件config配置保存到db

  根据config配置使用r.js或webpack打包

  发布打包后输出文件

  css3动画

  transform

  animation

  transiction

  3D加速与动画加速

  动画库

  缓动函数速查表: http://www.xuanfengge.com/easeing/easeing/

  Ceaser: http://xuanfengge.com/easeing/ceaser/

  cubic-bezier:http://cubic-bezier.com/

  css网格布局

  susy

  Responsive Grid System

  Fluid 960 Grid(adaptjs)

  Simple Grid

  搜索引擎与前端SEO

  tdk优化

  页面内容优化

  唯一的H1标题

  img设置alt属性

  nofollow

  url优化

  统一链接

  301跳转

  canonical

  robot优化

  robots.txt

  meta robots

  sitemap

  SEO工具

  各种站长工具等

  浏览器缓存种类,resources,webSQL,indexDB, localstorage,cookie,app cache,cache storage

  store.js、cookie.js

  UI框架

  bootstrap、jqwidgets、semantic ui、amaze ui

  微信手Q ui: frozenui、weui、blend ui

  extjs、echart图表ui

  ......


  五、native/hybrid/桌面开发

  ionic移动开发方案

  运行架构

  hybrid混合开发

  cordova交互

  离线包更新

  性能瓶颈

  nativescript移动开发方案

  react Native移动开发方案

  运行架构:js引擎

  性能缺陷与内存泄露

  更新机制

  使用场景<

您可能想查找下面的文章:

  • 一款利用html5和css3动画排列人物头像的实例演示
  • html5教程调用绘图api画简单的圆形代码分享
  • html5教程画矩形代码分享
  • html5教程制作简单画板代码分享
  • html5基础教程常用技巧整理
  • html5教程-Canvas入门
  • html5教程画矩形代码分享
  • HTML5晃动DeviceMotionEvent事件
  • HTML5教程之html 5 本地数据库(Web Sql Database)
  • HTML5中对contenteditable属性的解释与规定

相关文章

  • 2018-12-03HTML5新增的表单元素和属性实例解析_html5教程技巧
  • 2018-12-03HTML5体验改进的14条军规
  • 2018-12-03SVG(可缩放矢量图形)基本图形绘制方法与path路径命令
  • 2018-12-03分享一个用canvas合成海报图片的移动端项目
  • 2018-12-03html5服务器推送的详细介绍
  • 2017-08-06HTML5资源预加载(Link prefetch)详细介绍(给你的网页加速)
  • 2018-12-03SVG基础|绘制SVG连接标记MARKERS
  • 2018-12-03HTML5中的<aside>元素与<article>元素 实例详解
  • 2018-12-03带你玩转css3的3D!
  • 2018-12-03HTML5漫谈(2)–HTML5为什么这样红?

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML5 贪吃蛇游戏实现思路及源代码
    • HTML5之SVG 2D入门12—SVG DOM及DOM操作介绍_html5教程技巧
    • 如何提取图片的主题色?
    • H5实现可缩放的时钟动画
    • ESS和Sass的基本特性及区别
    • 大牛们鉴定下我网页制作的(html Div+css)属于什么水平?
    • HTML5标准学习-DOCTYPE头部分析
    • 解析HTML5的存储功能和web SQL的相关操作方法_html5教程技巧
    • 网易微博Web App用HTML5开发的过程介绍_html5教程技巧
    • 基于第一个PhoneGap(cordova)的应用详解

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有