2024年最新5(5),2024年最新腾讯前端面试难吗

总结

面试前要精心做好准备,简历上写的知识点和原理都需要准备好,项目上多想想难点和亮点,这是面试时能和别人不一样的地方。

还有就是表现出自己的谦虚好学,以及对于未来持续进阶的规划,企业招人更偏爱稳定的人。

万事开头难,但是程序员这一条路坚持几年后发展空间还是非常大的,一切重在坚持。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

前端面试题汇总

JavaScript

前端资料汇总

因为测试环境测试不出生产环境的问题,生产环境订单量较大,我看了一下订单加在一起有三千多万条,因此部署到生产环境之后导出功能出现了两个问题,一个是内存溢出,另一个是导出超时。

二、解决步骤

1.思路:

因为导出的数据格式和查询的数据格式相同,因此开发时,导出的逻辑是在线程池中分页查询每一页数据然后组装完成Excel,因此我优化导出功能时其实是包含着优化查询功能,查询的逻辑是线程池按时间分段查询数据。

2.解决步骤:

(1)第一阶段

上生产之后报内存溢出(OutOfMemory:Heap Space)我首先检查了一下代码,主要考虑堆溢出的原因,发现了一些没有必要的或者肉眼可见的问题进行了第一次优化,具体内容如下:

  • 数据库方面:从查询sql字段由“*”减少到只查询需要展示的几个字段,提高查询速度,降低内存容量。
  • Excel生成工具:因为Excel生成工具我用的是HSSFWorkbook,这个生成的数据流是往内存中写的,当数据量过大时,肯定会超出内存承受能力。从HSSFWorkbook改成SXSSFWorkbook,SXSSFWorkbook是专门用于大数据量时使用,SXSSFWorkbook是streaming版本的XSSFWorkbook,它只会保存最新的rows在内存里供查看,在此之前的rows都会被写入到硬盘里,因此可以降低内存的消耗(解决堆溢出问题)。
  • 减少创建对象的数量:在每页生成Excel行数时,每个SXSSFCell我都创建了一个cell对象来设置换行样式和数据信息,因为是堆溢出,说明对象创建的太多了。而且我生成Excel数据流时使用的是线程池,需要内存同时存放多个线程的cell对象,这样太费内存了,因此我去掉了用对象接收cell,而是直接createCell,然后设置有样式使用getCell。降低了内存的压力。
  • 使用Redis缓存:针对用户相同的查询条件,将查询条件和查询结果缓存到Redis中,这样,下次用户进行分页查询时就不需要再去访问数据库重新组装数据了,降低数据库访问压力。

第一阶段优化结果:经过上面第一阶段的优化,我又重新上了生产,再次测试一万以上的数据导出,好吧,超时(一分钟为最大访问时间)。
于是,我进行了第二阶段的优化:

(2)第二阶段
  • 逻辑上:之前因为导出的数据格式和查询的数据格式相同,因此开发时,导出的逻辑是在线程池中分页查询每一页数据然后组装完成Excel。但是直接调用查询方法会重复调用相同逻辑,比如查询时,每次都会检查Redis中是否已存在相同的查询条件,这个检查也是比较耗时的。于是我改成了不直接调用查询方法,在组装Excel数据前,先检查Redis中数据是否已存在,若存在,则直接使用数据去循环组装每页数据,这样节省了查询Redis的时间。

这里分享一份由字节前端面试官整理的「2021大厂前端面试手册」,内容囊括Html、CSS、Javascript、Vue、HTTP、浏览器面试题、数据结构与算法。全部整理在下方文档中,共计111道

HTML

  • HTML5有哪些新特性?

  • Doctype作⽤? 严格模式与混杂模式如何区分?它们有何意义?

  • 如何实现浏览器内多个标签页之间的通信?

  • ⾏内元素有哪些?块级元素有哪些? 空(void)元素有那些?⾏内元 素和块级元素有什么区别?

  • 简述⼀下src与href的区别?

  • cookies,sessionStorage,localStorage 的区别?

  • HTML5 的离线储存的使用和原理?

  • 怎样处理 移动端 1px 被 渲染成 2px 问题?

  • iframe 的优缺点?

  • Canvas 和 SVG 图形的区别是什么?

JavaScript

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

  • 问:0.1 + 0.2 === 0.3 嘛?为什么?

  • JS 数据类型

  • 写代码:实现函数能够深度克隆基本类型

  • 事件流

  • 事件是如何实现的?

  • new 一个函数发生了什么

  • 什么是作用域?

  • JS 隐式转换,显示转换

  • 了解 this 嘛,bind,call,apply 具体指什么

  • 手写 bind、apply、call

  • setTimeout(fn, 0)多久才执行,Event Loop

  • 手写题:Promise 原理

  • 说一下原型链和原型链的继承吧

  • 数组能够调用的函数有那些?

  • PWA使用过吗?serviceWorker的使用原理是啥?

  • ES6 之前使用 prototype 实现继承

  • 箭头函数和普通函数有啥区别?箭头函数能当构造函数吗?

  • 事件循环机制 (Event Loop)

  • 29
    点赞
  • 26
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值