本文收集了14个响应式前端开发框架,可以帮助前端开发人员大大简化开发过程。针对每个框架,文中均指出了它所包含的UI组件及JavaScript插件。几乎所有的框架都采用了响应式网格系统。
使用这些前端框架,有如下好处:
-
**跨浏览器。**这一点已被证实。
-
**一致性。**UI组件,如导航、按钮、标签、表单、下拉框、表格……,在设计上保持风格一致。
-
**快速开发。**你可以快速、容易地构建布局。这些框架都配有详细的说明文档。
-
**响应式。**所有CSS组件及JavaScript插件可以很好地从桌面过渡到移动设备上。
Ink为一个界面工具包,用于快速开发Web界面,具有易于使用、易于扩展特点。它可以为构建布局提供解决方案,可以展示普通的界面元素,可以实现以内容为中心、对用户友好的交互方式。
-
HTML&CSS:布局、导航、排版、图标、表单、提示框、表格
-
JS:Gallery、表格、树视图、排序列表、日期选择插件、制表符、表单验证及一些行为(停靠、折叠、关闭)
-
其他:Sass Mixins
GroundworkCSS是一个基于Sass预处理器的开源项目 ,主要用于快速构建响应式Web应用程序。拥有一个灵活的、可嵌套的网格系统,可以创建适应多种浏览设备的布局。GroundworkCSS还提供多种UI 组件,如导航、按钮、图标、表单、Tabs、对话框、工具提示等等。
-
HTML&CSS:网格、布局、排版、按键、标题、表单、图标、社交图标、响应式文本、对话框、工具提示
-
JS:导航、制表符(Tab)、提示框、Cycle2
-
其他:Sass Mixins
这是一个灵活、强大的响应式Web框架,使Web开发更快速、更简单。
-
HTML&CSS:网格、排版、表单、按钮、提示框、页码、面包屑导航(breadcrumb)、列表、表格
-
JS:提示框、制表符(Tab)、切换开关(Toggle switch)、折叠
Foundation由ZURB公司设计,ZURB是一家产品设计公司,位于加州坎贝尔。Foundation为最先进的响应式前端开发框架,它拥有很多布局模板、CSS样式表及自己开发的优秀JavaScript插件。
- HTML&CSS:网格、布局模板、图标字体、响应式表格、SVG格式的社交图标、页码、面包屑导航(breadcrumbs)、侧导航、按键、排版、标签、提示框、面板、价格表、进度栏、表格、缩略图
性能优化
1.webpack打包文件体积过大?(最终打包为一个js文件)
2.如何优化webpack构建的性能
3.移动端的性能优化
4.Vue的SPA 如何优化加载速度
5.移动端300ms延迟
6.页面的重构
所有的知识点都有详细的解答,我整理成了280页PDF《前端校招面试真题精编解析》。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】