千锋扣丁学堂HTML5培训之H5开发工程师面试题及答案

2019-07-24 14:26:15 2815浏览

很多学习很好的小伙伴有时候会抱怨说明明自己技术没有问题，但总是在面试的时候就怯场不知道如何应对了，所以说，想要面试能达到好的效果，那么熟悉面试题将会让我们的面试通过率更高，今天就分享一份面试中常出现的HTML5面试题及答案。


1、项目上线流程是怎样的?

(1)流程建议

-模拟线上的开发环境

本地反向代理线上真实环境开发即可。(apache，nginx，nodejs均可实现)

-模拟线上的测试环境

模拟线上的测试环境，其实是需要一台有真实数据的测试机，建议没条件搭daily的，就直接用线上数据测好了，只不过程序部分走你们的测试环境而已，有条件搭daily最好。

-可连调的测试环境

可连调的测试环境，分为2种。一种是开发测试都在一个局域网段，直接绑hosts即可，不在一个网段，就每人分配一台虚拟的测试机，放在大家都可以访问到的公司内网，代码直接往上布即可。

-自动化的上线系统

自动化的上线系统，可以采用Jenkins。如果没有，可以自行搭建一个简易的上线系统，原理是每次上线时都抽取最新的trunk或master，做一个tag，再打一个时间戳的标记，然后分发到cdn就行了。界面里就2个功能，打tag，回滚到某tag，部署。

-适合前后端的开发流程

开发流程依据公司所用到的工具，构建，框架。原则就是分散独立开发，互相不干扰，连调时有hosts可绑即可。

(2)简单的可操作流程

-代码通过git管理，新需求创建新分支，分支开发，主干发布

-上线走简易上线系统，参见上一节

-通过gulp+webpack连到发布系统，一键集成，本地只关心原码开发

-本地环境通过webpack反向代理的server

-搭建基于linux的本地测试机，自动完成build+push功能

2、工程化怎么管理的?

gulp和webpack

3、git常用命令

Workspace：工作区

Index/Stage：暂存区

Repository：仓库区(或本地仓库)

Remote：远程仓库

4、webpack和gulp对比

Gulp就是为了规范前端开发流程，实现前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等功能的一个前端自动化构建工具。说的形象点，“Gulp就像是一个产品的流水线，整个产品从无到有，都要受流水线的控制，在流水线上我们可以对产品进行管理。”另外，Gulp是通过task对整个开发过程进行构建。

Webpack是当下最热门的前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源。还可以将按需加载的模块进行代码分隔，等到实际需要的时候再异步加载。通过loader的转换，任何形式的资源都可以视作模块，比如CommonJs模块、AMD模块、ES6模块、CSS、图片、JSON、Coffeescript、LESS等。

Gulp和Webpack功能实现对比：从基本概念、启动本地Server、sass/less预编译、模块化开发、文件合并与压缩、mock数据、版本控制、组件控制八个方面对Gulp和Webpack进行对比。

5、webpack打包文件太大怎么办?

webpack把我们所有的文件都打包成一个JS文件，这样即使你是小项目，打包后的文件也会非常大。可以从去除不必要的插件，提取第三方库，代码压缩，代码分割，设置缓存几个方面着手优化。

6、不想让别人盗用你的图片，访问你的服务器资源该怎么处理?

目前常用的防盗链方法主要有两种：

(1)设置Referer：适合不想写代码的用户，也适合喜欢开发的用户

(2)签名URL：适合喜欢开发的用户

7、精灵图和base64如何选择?

css精灵，用于一些小的图标不是特别多，一个的体积也稍大，比如大于10K(这个没有严格的界定)。

base64，用于小图标体积较小(相对于css精灵)，多少都无所谓。字体图标，用于一些别人做好的图标库(也有少数自己去做的)用起来比较方便，他的图标只能用于单色，图标用只能于一种颜色。

以上就是关于千锋扣丁学堂HTML5培训之H5开发工程师面试题及答案的全部内容，想要了解更多关于HTML5开发方面内容的小伙伴，请关注扣丁学堂HTML5培训官网、微信等平台，扣丁学堂IT职业在线学习教育有专业的HTML5讲师为您指导，此外扣丁学堂老师精心推出的HTML5视频教程定能让你快速掌握HTML5从入门到精通开发实战技能。扣丁学堂H5技术交流群：673883249。

                             

     【关注微信公众号获取更多学习资料】        【扫码进入HTML5前端开发VIP免费公开课】  

查看更多关于“HTML5开发技术资讯”的相关文章>>