🚀 个人主页 极客小俊
✍🏻 作者简介:web开发者、设计师、技术分享博主
🐋 希望大家多多支持一下, 我们一起进步!😄
🏅 如果文章对你有帮助的话,欢迎评论 💬点赞👍🏻 收藏 📂加关注
脚手架 是指什么?
前端开发中提到的“脚手架”是一个形象的比喻,比喻各类语言的前期工作环境。
在软件开发上(当然也包括前端开发)的脚手架指的就是:有人帮你把这个开发过程中要用到的工具、环境都配置好了,你就可以方便地直接开始做开发,专注你的业务,而不用再花时间去配置这个开发环境,这个开发环境就是脚手架。
比如vue.js就有个vue-cli脚手架,基于node.js的开发环境,作者帮你把开发环境大部分东西都配置好了,你把脚手架下载下来就可以直接开发了,不用再考虑搭建这些工具环境。
W3C 是什么?
W3C是World Wide Web Consortium的缩写,表示的是“万维网联盟”。
W3C是WEB技术领域,国际中立性技术标准机构。主要工作是发展WEB规范。
SPA是什么?
百度官方的解释是: 单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。
特点
速度:更好的用户体验,让用户在web app感受native app的速度和流畅,
MVC:经典MVC开发模式,前后端各负其责。
ajax:重前端,业务逻辑全部在本地操作,数据都需要通过AJAX同步、提交。
路由:在URL中采用#号来作为当前视图的地址,改变#号后的参数,页面并不会重载。
单页Web应用(single page web application,SPA)是当今网站开发技术的弄潮儿,很多传统网站都在或者已经转型为单页Web应用,新的单页Web应用网站(包括移动平台上的)也如雨后春笋般涌现在人们的面前,如Gmail、Evernote、Trello等。如果你是一名Web开发人员,却还没开发过或者甚至是没有听说过单页应用,那你已经Out很久了。
单页Web应用和前端工程师们息息相关,因为主要的变革发生在浏览器端,用到的技术其实还是HTML+CSS+JavaScript,所有的浏览器都原生支持,当然有的浏览器因为具备一些高级特性,从而使得单页Web应用的用户体验更上一层楼。关于单页应用的优点和缺点,网上讲解的文章有很多,这里就不展开论述了。 单页Web应用,顾名思义,就是只有一张Web页面的应用。浏览器一开始会加载必需的HTML、CSS和JavaScript,之后所有的操作都在这张页面上完成,这一切都由JavaScript来控制。因此,单页Web应用会包含大量的JavaScript代码,复杂度可想而知,模块化开发和设计的重要性不言而喻
第一次进入页面时会请求一个html
文件,刷新清除一下,切换到其他组件,此时路径也相应变化,但是并没有新的html
文件请求,页面内容却变化了。(MPA)每一次页面跳转的时候,后台服务器都会返回一个新的html
文档,这种类型的网站也就是多页网站,也叫多页应用。
CDN是什么?
简单地说,CDN是一个经策略性部署的整体系统,包括分布式存储、负载均衡、网络请求的重定向和内容管理4个要件,而内容管理和全局的网络流量管理(Traffic Management)是CDN的核心所在。通过用户就近性和服务器负载的判断,CDN确保内容以一种极为高效的方式为用户的请求提供服务。
解决因分布、带宽、服务器性能带来的访问延迟问题,适用于站点加速、点播、直播等场景。使用户可就近取得所需内容,解决 Internet网络拥挤的状况,提高用户访问网站的响应速度和成功率。
控制时延无疑是现代信息科技的重要指标,CDN的意图就是尽可能的减少资源在转发、传输、链路抖动等情况下顺利保障信息的连贯性。
CDN就是扮演者护航者和加速者的角色,更快准狠的触发信息和触达每一个用户,带来更为极致的使用体验。
再通俗点说就是在网速一定的前提下,CDN就像网络中快递员小哥
Hack css是什么?
Hack,英文含义为“修改”。由于不同的浏览器对CSS的支持程度不同,同样CSS的样式代码在不同浏览器当中的表现可能出现不一致。为了让所有浏览器样式统一,有时需要为某种浏览器设置不同于其他浏览器的“专属样式”。
Hack技术的原理
利用CSS中的优先级以及CSS Hack技术,来实现“不同浏览器”对应“不同CSS”的需求。
Hack的种类
CSS Hack主要针对IE浏览器,可以分为3种表现形式:
● 属性前缀法:CSS属性上添加Hack(height: 300px;);
● 选择器前缀法:在选择器上添加Hack(html { });
● 条件注释法:头部引用Hack()。
GPU&CPU 在前端开发中的重要性
显卡的处理器称为图形处理器(GPU),它是显卡的“心脏”,与CPU类似,只不过GPU是专为执行复杂的数学和几何计算而设计的。
默认情况下,网页的渲染使用的是CPU。如果有了GPU来处理图形任务,那么CPU就可以执行其他更多系统任务,从而提升计算机整体性能。
GPU加速的主要用途
主要用于CSS3技术中,提升二维动画的渲染速度。
GPU加速的触发方法
为动画DOM元素添加如下CSS3样式。
-webkit-transform:translate3d(0,0,0);
-webkit-transform:translateZ(0);
两种方法都会开启GPU硬件加速模式,从而让浏览器在渲染动画时从CPU转向GPU。
对于网页效果来说,由于如上代码中的值设置为0,因此,并没有真正使用3D效果,但浏览器却因此开启了GPU硬件加速模式。
GPU加速的应用场景
● 涉及大量大尺寸图片的动画;
● 涉及大量DOM元素的CSS3动画。
Sprite是什么?
CSS Sprite,也有人将其称为CSS精灵,是一种网页图片应用处理方式。它允许将一个页面涉及到的所有零星图片都合并到一张大图当中,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。
CSS Sprite的原理
CSS Sprite与Photoshop的背景图合并一样,就是把网页中一些背景图片整合到一张图片文件中,再利用CSS的background-position属性的进行背景定位。
缺点:
png图片本身大小会超过jpg,解决办法,尽量吧小的图片转成baseurl, 在吧精灵图压缩
ERP是什么?
(企业资源计划——Enterprise Resource Planning)
ERP是针对: 物资资源管理(物流)、人力资源管理(人流)、财务资源管理(财流)、信息资源管理(信息流)集成一体化的企业管理软件或者系统。ERP的核心管理思想就是实现对整个供应链的有效管理
OA是什么?
(办公自动化——Office Automation)
是现代利用电脑进行全自动的办公,目的是提高效率。
CMS是什么?
内容管理系统——Content Management System
它具有许多基于模板的优秀设计,可以加快网站开发的速度和减少开发的成本。CMS其实是一个很广泛的称呼,从一般的博客程序,新闻发布程序,到综合性的网站管理程序都可以被称为内容管理系统。
CRM是什么?
"客户关系管理(CRM)是代表增进赢利、收入和客户满意度而设计的,企业范围的商业战略。" :"客户关系管理(CRM)是代表增进
主要是管理客户和供应商,以及管理仓库和物料,其主要表现在客户资料管理、联系记录的管理和订单的管理等,多用于业务部门。如:记录客户的联系方式,客户的需求,客户的交易记录等和客户相关的功能。但是不具有ERP的预警、分析等职能。CRM不是企业级管理系统,一般只应用于销售部。
GIS是什么?
地理信息系统(Geographic Information System或 Geo-Information system,GIS)有时又称为“地学信息系统”。一般来说是和地图应用相关的项目
API是什么?
API(Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。
SDK是什么?
SDK(Software Development Kit)软件开发工具包,是一个相当广泛的名词,可以这么说辅助开发某一类软件的相关文档,范例和工具的集合都可以叫做“SDK”。SDK是一系列文件的组合,它为软件的开发提供了一个平台。
JDK是什么?
JDK(Java Development Kit)Java 开发工具包,是针对Java开发的产品。JDK是SDK的一个子集,因为它是开发java程序的一个平台,开发其他程序的SDK可以没有JDK。比如你下载了一个软件平台eclipse-SDK-3.2.2-win32.zip,它本身里面是没有JDK的。但是只要开发Java程序就必须使用JDK(Java EE和Java SE)
JDK(Java Development Kit)又称J2SDK(Java2 Software Development Kit),是Java开发工具包,它提供了Java的开发环境(提供了编译器javac等工具,用于将java文件编译为class文件)和运行环境(提 供了JVM和Runtime辅助包,用于解析class文件使其得到运行)。如果你下载并安装了JDK,那么你不仅可以开发Java程序,也同时拥有了运行Java程序的平台。JDK是整个Java的核心,包括了Java运行环境(JRE),一堆Java工具tools.jar和Java标准类库 (rt.jar)
JRE是什么?
JRE(Java Runtime Enviroment)是Java的运行环境。面向Java程序的使用者,而不是开发者。如果你仅下载并安装了JRE,那么你的系统只能运行Java程序。JRE是运行Java程序所必须环境的集合,包含JVM标准实现及 Java核心类库。它包括Java虚拟机、Java平台核心类和支持文件。它不包含开发工具(编译器、调试器等)。
IDE是什么?
IDE(Integrated Development Environment,简称IDE,集成开发环境)
是一种辅助程序开发人员开发软件的应用软件。如 Sublime, Webstrom, Visual Studio,Eclipse等。
算法是什么?
对特定问题的解决步骤。菜谱就是一种算法。
数据结构是什么?
数据的内部构成称为数据结构。数据结构是信息的一种组织方式,其目的是为了提高算法的效率。
遍历 指是什么?
在数据结构中有遍历这个概念,简单点就是将数据的所有节点都查询一遍。
回调函数 是什么?
回调指: 函数A作为参数传入函数B,函数B 在某个时候调用函数A,函数A 则为回调。
回调函数常常简称为回调。
同步和异步 是什么意思?
同步编程
即是一种典型的请求-响应模型,当请求调用一个函数或方法后,需等待其响应返回,然后执行后续代码。
异步编程
不同于同步编程的请求-响应模式,其是一种事件驱动编程,请求调用函数或方法后,无需立即等待响应,可以继续执行其他任务,而之前任务响应返回后可以通过状态、通知和回调来通知调用者。
同步是阻塞模式,异步是非阻塞模式。
==比喻如下==
同步就是你叫我去吃饭,我听到了就和你去吃饭;如果没有听到,你就不停的叫,直到我告诉你听到了,才一起去吃饭。
异步就是你叫我,然后自己去吃饭,我得到消息后可能立即走,也可能等到下班才去吃饭。
Stylus、Less、Sass是什么?
三个都是是 CSS 的预处理框架。
stylus是相比less、sass更简洁一点
Less 和 Sass 都是 CSS 的预处理工具,提供了很多 CSS 没有的功能,如混入、变量、运算、函数、嵌套、颜色处理等。
ECMAScript是什么?
ECMAscript根据MCMA-262标准,实现的通用脚本语言规范 是一种语法标准
javascript 是通用的跨平台脚本语言,他遵守ECMA262的标准,换句话说就是ECMAscript的方言,其他的还有微软的jscript等。
总之;ECMAscript可以理解为是JavaScript的一个标准,一种脚本语言的标准化规范
Yarn、npm、cnpm是什么意思?
Yarn是由Facebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具 ,正如官方文档中写的,Yarn 是为了弥补 npm 的一些缺陷而出现的。
npm是Node软件包管理器
npm是nodejs官方未nodejs定制的一个工具,是Node.js的包管理器,是Node Packaged Modules的简称,通过npm可以下载安装nodejs的模块包,nodejs有很多优秀的模块包可以让开发这快速开发。是为了帮助Node解决依赖包的安装问题
NPM属于Node模块的管理器
cnpm是淘宝团队做的国内镜像,因为npm的服务器位于国外可能会影响安装。淘宝镜像与官方同步频率目前为 10分钟 一次以保证尽量与官方服务同步。
spm、bower、Component是什么?
spm和bower、Component是前端模块管理,作为一个静态资源共享平台,用来发布和共享前端模块
spm和bower、component都是针对前端模块化共享而提供的解决方案
CommonJS 是什么?
是以在浏览器环境之外构建 javaScript 生态系统为目标而产生的写一套规范,主要是为了解决 javaScript 的作用域问题而定义的模块形式,可以使每个模块它自身的命名空间中执行,该规范的主要内容是,模块必须通过 module.exports 导出对外的变量或者接口,通过 require() 来导入其他模块的输出到当前模块的作用域中;目前在服务器和桌面环境中,node.js 遵循的是 CommonJS 的规范;CommonJS 对模块的加载时同步的;
根据CommonJS规范,一个单独的文件就是一个模块。加载模块使用require方法,该方法读取一个文件并执行,最后返回文件内部的exports对象。可以理解为CommonJS是一种规范,是用在服务器端的,NodeJS是这种规范的实现。CommonJS API定义很多普通应用程序(主要指非浏览器的应用)使用的API,从而填补了这个空白。
开发者可以使用CommonJS API编写应用程序,然后这些应用可以运行在不同的JavaScript解释器和不同的主机环境中:
①服务器端JavaScript应用程序
②命令行工具
③图形界面应用程序
④混合应用程序
CommonJS 是一种规范 AngularJS RequireJS ReactJS SeaJS是基于这种规范上应运而生的框架
什么是FIS?
FIS 前端集成解决方案 Front-end Integrated Solution
fis主要做的就是优化代码,对源代码进行压缩混淆,主要是为了解决前端的各种难题。它可以自动替换资源路径,对地址加hash值,压缩打包,一键发布优化后的代码到服务器。其实和gulp、grunt、webpack能工具一样,不过fis自己的生态功能比较完善,而且有各种场景适用方案。使用fis,支持smarty、java等后段代码压缩,支持模块化开发。对前端优化无非实现三点:
资源定位
内容嵌入
依赖分析
2011年底,百度web前端研发部成立F.I.S团队,汇集了来自各产品线的精英工程师,该团队的任务是寻找提升前端工业生产力水平的解决方案。经过 1年半的努力,fis团队和百度众多产品线共同探索出一套前端集成解决方案,解决了诸如 前端静态资源加载优化、页面运行性能优化、基础编译工具、运行环境模拟、js与css组件化开发 等前端领域开发的核心问题。如今,fis团队的解决方案已应用到百度40多个产品线,覆盖了从pc到无线终端的应用,提升了前端团队的生产力水平,降低了开发成本。
什么是grunt、 gulp
前端构建工具也可以理解为前端自动化工具
- 可以自动编译less,sass为css
- 文件合并
- 文件压缩
- 语法检查
- 监听文件变化
什么是GIT和SVN ?
简单来说GIT和SVN都是版本管理系统。GIT跟SVN一样有自己的集中式版本库或服务器。但,GIT更倾向于被使用于分布式模式,也就是每个开发人员从中心版本库/服务器上chect out代码后会在自己的机器上克隆一个自己的版本库。
GIT和SVN 属于同一类型技术
CoffeeScript什么是?
CoffeeScript是一套JavaScript的转译语言,相当于是JavaScript预编译有点像css预编译的意思
CoffeeScript 会将类似 Ruby 语法的代码编译成 JavaScript 而且大部分结构都相似,但不同的是 CoffeeScript 拥有更严格的语
什么是前端模块化开发?
DuoJS
RequireJS
Sea.js
ReactJS
AngularJS
浏览器本身并不提供模块管理的机制,为了调用各个模块,有时不得不在网页中,加入一大堆script标签。这样就使得网页体积臃肿,难以维护,还产生大量的HTTP请求,拖慢显示速度,影响用户体验。
为了解决这个问题,前端的模块管理器(package management)应运而生。它可以轻松管理各种JavaScript脚本的依赖关系,自动加载各个模块,使得网页结构清晰合理。不夸张地说,将来所有的前端JavaScript项目,应该都会采用这种方式开发。
最早也是最有名的前端模块管理器,非RequireJS莫属。它采用AMD格式,异步加载各种模块。具体的用法,可以参考我写的教程。Require.js的问题在于各种参数设置过于繁琐,不容易学习,很难完全掌握。而且,实际应用中,往往还需要在服务器端,将所有模块合并后,再统一加载,这多出了很多工作量。
AMD、CMD 是什么?
AMD((Asynchromous Module Definition) 是 RequireJS 在推广过程中对模块定义的规范化产出
CMD是SeaJS 在推广过程中对模块定义的规范化产出
AMD、CMD是用在浏览器端的,异步的,如RequireJS 和SeaJS
AMD CMD Bower Component NPM属于同一类型技术