-
前端劝退之前端知识体系（前端面试体系）
前言 虽然马上就要金九银十了，面试的人应该不少，虽然我也有在面，写文的目的主要是梳理下知识，能对复习有点帮助就行，本文主要针对前端知识体系相关，涉及的内容有： 浏览器 计算机网络 前端基础（html、css、js） node webpack 数据结构和算法 web安全 前端工程化（编译原理的应用） 渲染优化 性能监控 不包括： 跨端（小程序、混合应用） 框架 typescript 移动端 不过前端…- 24
- 0
-
如何写出让同事无法维护的代码？(文中推荐做法)
对，你没看错，本文就是教你怎么写出让同事无法维护的代码。 一、程序命名 容易输入的变量名 。比如：Fred，asdf 单字母的变量名 。比如：a,b,c, x,y,z（如果不够用，可以考虑a1,a2,a3,a4,….） 有创意地拼写错误 。比如：SetPintleOpening， SetPintalClosing。这样可以让人很难搜索代码。 抽象 。比如：ProcessData, DoIt, Ge…- 22
- 0
-
基于js管理大文件上传以及断点续传
前言 前端小伙伴们平常在开发过程中文件上传是经常遇到的一个问题，也许你能够实现相关的功能，但是做完后回想代码实现上是不是有点”力不从心”呢？你真的了解文件上传吗？如何做到大文件上传以及断电续传呢，前后端通讯常用的格式，文件上传进度管控，服务端是如何实现的？接下来让我们开启手摸手系列的学习吧！！！如有不足之处，望不吝指教，接下来按照下图进行学习探讨 一切就绪，开始吧！！！ 前…- 33
- 0
-
前端九条 bug 分享 (ts相关知识较多)
本期 最近换了新工作终于凑齐一些有趣的bug与问题了, 比如在ts方面做了深入的研究, 国际化开发方面有了一些思考等等, 总之新的工作刚刚开始就收获满满, 有对’字节跳动’国际化业务感兴趣的同学可以把简历砸过来, 将来一起挑战各种有趣的难题。(当然除了国际化其它岗位我也可以内推的! 🙋🏻) 小声说: 最近实在是好多事要忙, 像3d地球那个系列只能过段时间更新了……- 22
- 0
-
一行可以让项目启动快 70% 以上的代码(实用)
前言 这两天闲来无事，想优化优化项目的启动时间，用了一个下午吧，将项目启动时间从48秒优化到14秒，大约70左右，效果还是有的，而且仅仅用了一行代码。 👇会讲一下找到这行代码的过程，如果没有耐心可以直接跳转到文章底部，直接看结论即可。 项目背景 项目就是简单的Vue项目，不过公司内部给vue-cli包了一层，不过影响不大。 别的也就没啥了，正常的H5网页，用的插件也不算多，为了控制项目体积。 项目…- 21
- 0
-
CSS 代码快速实现烟花绽放（仅100多行代码）
最近项目上需要做一个烟花动画，要求是随机大小，不同地方出现，先看效果 Kapture 2021-08-20 at 23.17.31 一、选择合适的动画 什么样的场景决定使用什么样的动画。比如一些比较轻量、装饰性的动画，CSS 动画就足够了，而一些对动画要求比较高的运营活动，创意小游戏等，JS 动画肯定是首选，必要情况下还需要借助一些图形库，比如 Pixi.js。 其次，还需要从学习成本考虑。一般而…- 22
- 0
-
nodejs 写 bash 脚本终极方案！
前言 最近在学习bash脚本语法，但是如果对bash语法不是熟手的话，感觉非常容易出错，比如说：显示未定义的变量shell中变量没有定义，仍然是可以使用的，但是它的结果可能不是你所预期的。举个例子： #！/bin/bash # 这里是判断变量var是否等于字符串abc，但是var这个变量并没有声明 if- 21
- 0
-
不到30行 JavaScript代码，实现一个炫酷的全景交互
前言：本文将围绕：了解什么是全景 –> 怎么构成全景 –> 全景交互原理来进行讲解，手把手教你从零基础实现一个酷炫的Web全景，并讲解其中的原理。小白也能学习，建议收藏学习,有任何疑问，请在评论区讨论，笔者经常查看并回复。 一、了解什么是全景 1.1 全景定义 定义：全景是某一空间的_全部_景色。 通俗地说：大家都拍过照片，那我们想想一下拍照片的过程：站在某个空…- 29
- 0
-
第一人称视角带你走进 Vue 源码世界
前言 本文不引战，成熟的人应该脱离框架的范畴，而不是纠结谁更好或者谁更不好。有道是黑猫白猫，抓到老鼠就是好猫。 所以本文会带大家读源码。简单易懂，大佬小白都能看明白。并收获益处。 从 new 一个 Vue的实例粗来开始 准备工作： chrome 打开 Vue github 地址- 22
- 0
-
活用async/await，让Vue变得更好用的装饰器！
下文三个装饰器，都是利用了async/await把异步变成同步的特性实现的。 要求被装饰的方法必须写成async/await，用起来十分方便，实现彻底被隐藏在了装饰器内部。 前两个都是用在ts环境下class写法的vue里的。不过看清楚逻辑后，很容易修改成可以用在js环境中的vue组件上。 1、 给vue添加一个指示初始化完成的变量。 指业务相关的初始化逻辑都完成了 比如搜索功能：搜索中显示loa…- 23
- 0
-
能用CSS实现的就不用麻烦JavaScript
前言 凡是可以用 JavaScript 来写的应用，最终都会用 JavaScript 来写。——Atwood定律 虽然万物都可以是JavaScript，但某种程度css的运行效率会比JavaScript高，所以笔者认为:能用CSS实现的就不用麻烦JavaScript。 两种语言都有不同的用途随着浏览器版本特性和属性的增加，CSS正成为一种功能强大的语言，能够处理我们以前依赖JavaScript实现…- 18
- 0
-
Github标星2.6K！微软开源的可视化工具，未免太酷炫了吧
说到数据可视化，大家都很熟悉了，设计师、数据分析师、数据科学家等，都需要用各种方式各种途径做着数据可视化的工作…..当然许多程序员在工作中有时也需要用到一些数据可视化工具，如果工具用得好，就可以把原本枯燥凌乱的数据，变得直观又形象，瞬间高大上。 今天和大家分享一个由微软开源的可视化工具——SandDance。 前段时间，首席软件开发工程师Dan Marshall在其帖子中表示：“San…- 20
- 0
-
Vue中避免滥用this去读取data中数据
前言 在Vue中，data选项是个好东西，把数据往里一丢，在一个Vue组件中任何一个地方都可以通过this来读取data中数据。但是要避免滥用this去读取data中数据，至于在哪里要避免滥用，如果滥用会导致什么后果，本专栏将会一一揭晓。 一、用this读取data中数据的过程 在Vue源码中会把data中数据添加getter函数和setter函数，将其转成响应式的。getter函数代码如下所示：…- 23
- 0
-
如何将 Vue2 代码一键转成 Vue3 代码
Vue3 已经出来有一段时间了，很多朋友早已熟读了文档，写了好几个 Demo，馋 Composition API 等新特性已久了。无奈，在实际工作中，大部分朋友还是不得不守着成千上万行的 Vue2 老项目过日子，做一次框架升级就像给老房子装修——念头总是充沛，决心总是匮乏。 其实 Vue 团队已经尽可能地减少了破坏性更新，还提供了一份细致的迁移指南- 21
- 0
-
几百行代码肝个斗图机器人！
前言 有一天，组织内的斗图机器人坏掉了，巧不巧的是当你需要用它时，它坏掉了。 赶上要催交同学们的周报，没有表情包，就没办法委婉又不礼仪并友好和善的催促同学们交周报。 然后只能自己做图，打开了度娘，找合适表情，然后打开sketch，一通操作后，粘贴到群，搞定。 but总使用同一表情，又很枯燥，于是又打开度娘，打开sketch，一通操作，粘贴到群，搞定。 过了一段时间，度娘，sketch，群。 又过了…- 18
- 0
-
几百行代码肝个斗图机器人！
前言 有一天，组织内的斗图机器人坏掉了，巧不巧的是当你需要用它时，它坏掉了。 赶上要催交同学们的周报，没有表情包，就没办法委婉又不礼仪并友好和善的催促同学们交周报。 然后只能自己做图，打开了度娘，找合适表情，然后打开sketch，一通操作后，粘贴到群，搞定。 but总使用同一表情，又很枯燥，于是又打开度娘，打开sketch，一通操作，粘贴到群，搞定。 过了一段时间，度娘，sketch，群。 又过了…- 18
- 0
-
看一道简单的题目，控制台会输出什么？
仔细看下，内容如图，你觉得会输出什么？不要再想着直接复制粘贴到浏览器运行了 image.png 答案是 1、undefined, funtion arg(){} 2、undefined 3、108 4、undefind 5、我是熊大,年龄77 6、我是熊大,年龄188 7、我是熊大, 年龄88 复制代码 why？听我娓娓道来 第一条：demo(18)执行 触发console.log(obj1, a…- 25
- 0
-
元宇宙相关的前端技术（最新技术）
资本热词：Metaverse 7 月 28 日 扎克伯格表示，该公司正在组建一个产品团队，致力于元宇宙（Metaverse）的开发。“未来五年内，将 Facebook 从社交媒体网络转变为一个元宇宙公司。” 英伟达通过一部纪录片自曝：“今年 4 月份那场发布会，全部是合成的” 今年3月初，“元宇宙第一股” 的美国多人在线 3D 创意社区 Roblox（罗布乐思） 已在纽交所上市，而其当天股价暴涨 …- 25
- 0
-
教你用 three.js 写一个炫酷的3D登陆页面
前言： 大家好，我是xx传媒严导（xx这两个字请自行脑补） 。 该篇文章用到的主要技术：vue3、three.js 我们先看看成品效果： 高清大图预览（会有些慢）： 废话不多说，直接进入正题 Three.js的基础知识 想象一下，在一个虚拟的3D世界中都需要什么？首先，要有一个立体的空间，其次是有光源，最重要的是要有一双眼睛。下面我们就看看在three.js中如何创建一个3D世界吧！ 创建一个场景…- 22
- 0
-
纯 CSS 自定义多行省略：从原理到实现
文字溢出怎么展示，你的需求是什么？单行还是多行？截断，省略，自定义样式，自适应高度？在这里你都能找到答案。接下来我会由浅入深，从原理到实现，带你一步步揭开多行省略的面纱。我们先从最简单的单行溢出省略开始， 热身，单行省略 这是一个全宇宙统一的方案，没有太多的魔法，戳我查看示例- 20
- 0
-
es6-async await 手写 前端进阶必备（包懂）
虽然上次的表白计划不了了之了，但我依然每天对她嘘寒问暖，我总相信，只要我对她好，总有一天我会感动她的。我也开始了所谓的舔狗之路…… 一次和她的聊天中知道她喜欢吃大后街的一家早餐，但每天都起不来。然后我提出帮她带早餐，起初她还觉得有点不好意思稍稍有拒绝的意思，后来在我一系列劝说下答应了，她答应的那一刻，我高兴的像个孩子，那是我们除同学之外的第一个交集，也给我无限的遐想和期望。…- 24
- 0
-
25个 CSS 案例演示和 DEMO
本文是笔者写CSS时常用的套路。不论效果再怎么华丽，万变不离其宗。 1、交错动画 有时候，我们需要给多个元素添加同一个动画，播放后，不难发现它们会一起运动，一起结束，这样就会显得很平淡无奇。 那么如何将动画变得稍微有趣一点呢？很简单，既然它们都是同一时刻开始运动的，那么让它们不在同一时刻运动不就可以了吗。如何让它们不在同一时刻运动呢？注意到CSS动画有延迟（delay）这一属性。 举个栗子，比如有…- 24
- 0
-
【社招】1.5年前端面试记录及思考（阿里、腾讯、百度 offer）
在过去的一个月里，自己面试了多家公司的前端岗位，很幸运的是拿到几个不错的 offer，所以想通过这篇文章做个记录与总结，希望给打算求职的你一些参考。 简单介绍 19届，本科，计算机相关专业。毕业后，一直在一家三线厂做前端开发的工作… 其实这次之所以想出来面试，一共有两个原因：其一是，校招结束后就没有面试的经历了，不知道自己目前在招聘市场的水平到底如何；其二是，自己想回南方发展。 所以 …- 21
- 0
-
￥优惠劵使用时效：无法使用使用时效：
之前
使用时效：永久有效优惠劵ID：×