前端 JS 安全对抗原理与实践

2023-12-22
阅读 8 分钟
450
如今这个时代,数据已经变得越来越重要,网页和APP是主流的数据载体,如果获取数据的接口没有设置任何的保护措施的话,数据就会被轻易地窃取或篡改。

前端动效讲解与实战

2022-09-26
阅读 18 分钟
1.8k
作者:vivo 互联网前端团队- ZhaoJie本文将从各个角度来对动画整个体系进行分类,并且介绍各种前端动画的实现方法,最后我们将总结在实际开发中的各个场景的动画选择方案。一、背景前端动画场景需求多对众多动画场景的技术实现方案选择上比较模糊各动画方案的优劣及适用场景认识模糊现有动画库太多,不知道选哪个主流动...

CSS Houdini:用浏览器引擎实现高级CSS效果

2022-07-11
阅读 13 分钟
2k
Houdini被称之为Magic of styling and layout on the web,看起来十分神秘,但实际上,Houdini并非什么神秘组织或者神奇魔法,它是一系列与CSS引擎相关的浏览器API的总称。

DevTools 实现原理与性能分析实战

2021-12-27
阅读 19 分钟
4.1k
从 2008 年 Google 释放出第一版的 Chrome 后,整个 Web 开发领域仿佛被注入了一股新鲜血液,渐渐打破了 IE 一家独大的时代。Chrome 和 Firefox 是 W3C Web 标准的坚定支持者,随着这两款开源浏览器市场份额逐渐加大,迎来了开发者的春天。这就迎来了一个新的职业分工——前端工程师 frontend-engineer,前端工程师促进了 ...
封面图

富文本及编辑器的跨平台方案

2021-08-17
阅读 6 分钟
4.8k
对于一个产品来说,用户的需求程度在一定程度上反映了其产品的价值。对于富文本编辑器而言,以 WEB 端(PC 浏览器、移动浏览器)、移动端(IOS 应用、Android 应用)、桌面端(windows、macOS)各自为战的系统生态,已经无法满足用户的需求。同时对于研发人员而言,各端都需要大量的资源投入进行重复能力的开发,这无疑...

Webpack 基石 tapable 揭秘

2021-03-10
阅读 14 分钟
3.5k
Webpack 基于 tapable 构建了其复杂庞大的流程管理系统,基于 tapable 的架构不仅解耦了流程节点和流程的具体实现,还保证了 Webpack 强大的扩展能力;学习掌握tapable,有助于我们深入理解 Webpack。

Node.js 模块化你所需要知道的事

2021-03-09
阅读 12 分钟
3.8k
我们知道,Node.js是基于CommonJS规范进行模块化管理的,模块化是面对复杂的业务场景不可或缺的工具,或许你经常使用它,但却从没有系统的了解过,所以今天我们来聊一聊Node.js模块化你所需要知道的一些事儿,一探Node.js模块化的面貌。

初识 D3.js :打造专属可视化

2021-01-12
阅读 6 分钟
8.9k
随着现在自定义可视化的需求日益增长,Highcharts、echarts等高度封装的可视化框架已经无法满足用户各种强定制性的可视化需求了,这个时候D3的无限定制的能力就脱颖而出。

异步编程之事件循环机制

2020-12-08
阅读 3 分钟
1.9k
本文着重讲解通过事件循环机制来实现多个异步操作的有序执行、并发执行;通过事件队列实现同级多个并发操作的先后执行顺序,通过微任务和宏任务的概念来讲解不同阶段任务执行的先后顺序,最后通过将浏览器和 Node 下的事件循环机制进行对比,对比其事件循环机制的不同之处,以及在 Node 端通过libuv引擎来实现多个异步任...

vivo商城前端架构升级—多端统一探索、实践与展望篇

2020-11-24
阅读 6 分钟
1.3k
一、引言本文将会从整体上介绍 vivo 商城在前端维度的多端统一探索和实践。从多端价值、为什么要做多端统一、如何满足多端业务需求、实践与创新,简洁直白的阐述我们在多端统一上所做的一切。二、多端探索为vivo商城带来了哪些价值多端的价值可以从技术架构升级和人力资源释放两个方面体现。1、技术架构全面升级从到我们...

使用 Preload&Prefetch 优化前端页面的资源加载

2020-11-11
阅读 6 分钟
2.1k
对于前端页面来说,静态资源的加载对页面性能起着至关重要的作用。本文将介绍浏览器提供的两个资源指令-preload/prefetch,它们能够辅助浏览器优化资源加载的顺序和时机,提升页面性能。

vivo悟空活动中台-打造 Nodejs 版本的MyBatis

2020-11-09
阅读 19 分钟
1.4k
在往期的系列技术文章中我们主要集中分享了前端技术的方方面面,如微组件的状态管理,微组件的跨平台探索,以及有损布局,性能优化等等。还未关注到的同学,如果感兴趣可以查看往期文章。

前端科普系列(5):ESLint - 守住优雅的护城河

2020-10-28
阅读 12 分钟
1.1k
【前端科普系列】帮助阅读者了解web前端,主要覆盖web前端的基础知识,但不深入讲解,定位为大而全并非细而精,适合非前端开发的同学对前端有一个系统的认识,能更好的与前端开发协作。尽可能的写成科普类文章,对于前端开发而言,只适合刚入门的新手。

vivo 商城前端架构升级—前后端分离篇

2020-10-27
阅读 4 分钟
1.9k
本文主要以 vivo 商城项目的前后端分离经验,总结前后端分离思路,整理前后端分离方案,以及分离过程中遇到的问题及解决方案。一、前言vivo官方商城在2015年创建网上商城,开辟网络销售渠道,几年来日活和销售额持续增长,极大的助力了vivo手机的销量。而随着业务版本迭代越来越快,业务内容逐渐增多,前后端不分离模式...

宏任务和微任务的一个小事

2020-10-14
阅读 6 分钟
3.7k
本文根据 JavaScript 规范入手,阐述了JS执行过程在考虑时效性和效率权衡中的演变,并通过从JS代码运行的基础机制事件队列入手,分析了JS不同任务类型(宏任务、微任务)的差别,通过这些差别给出了详细分析不同任务嵌套的复杂 JS 代码执行的分析流程。

“非主流”的纯前端性能优化

2020-09-23
阅读 11 分钟
3.6k
性能优化一直是前端研究的主要课题之一,因为不仅直接影响用户体验,对于商业性公司,网页性能的优劣更关乎流量变现效率的高低。例如 DoubleClick by Google 发现:

【Vue CLI】手把手教你撸插件

2020-09-17
阅读 3 分钟
1.7k
现如今 Vue 作为主流的前端框架之一,其健全的配套工具,活跃的开源社区,让广发码农热衷追捧。Vue CLI 作为其官方的开发构建工具,目前已更新迭代到 4.x 版本,其内部集成了日常开发用到的打包压缩等功能,简化了常规自己动手配置 webpack 的烦恼。另外提供的插件功能更是满足了使用者定制化的需求场景,那么本文就来讲...

vivo商城前端架构升级-总览篇

2020-09-07
阅读 7 分钟
2k
一年前 vivo 商城还是以 Java 为技术核心,前后台一起,Java 既要负责服务、数据库,也要负责页面的渲染。在早期这种开发模式也能够很好的运行。然而随着业务迭代的加快,前端技术的发展,这种开发模式的弊端越来越明显。主要突出的有以下两个方面:

vivo 悟空活动中台 - 栅格布局方案

2020-08-31
阅读 8 分钟
2.3k
用户在使用管理后台时,打开浏览器页面宽度不一。主流的显示宽度1920像素,但也存在1366,1600等其他宽度的场景。而且用户在桌面端搭建页面时,同时在操作的内容不仅仅是管理后台,可能会适当缩小页面宽度来做其他的事情。这样我们在页面布局时需要考虑到兼容广泛的屏幕宽度。

悟空活动中台 - 基于 WebP 的图片高性能加载方案

2020-08-17
阅读 10 分钟
1.8k
移动端网页的加载速度对用户体验极为重要,是影响页面转化率的关键因素,H5 活动页往往使用大量的图片素材来丰富活动效果,素材加载的快慢会对用户感知造成重要的影响。

vivo 悟空活动中台 - H5 活动加载优化

2020-08-03
阅读 11 分钟
2.5k
本文首发于 vivo互联网技术 微信公众号  链接: [链接] 作者:悟空中台研发团队【悟空活动中台】系列往期精彩文章:《揭秘 vivo 如何打造千万级 DAU 活动中台 - 启航篇》 主要为大家讲述 vivo 活动中台的能力与创新。《悟空活动中台 - 微组件状态管理(上)》介绍了活动页内 RSC 组件之间的状态管理和背后的设计思路。《...

前端科普系列(4):Babel —— 把 ES6 送上天的通天塔

2020-07-20
阅读 15 分钟
1.7k
在上一节 《CommonJS:不是前端却革命了前端》中,我们聊到了 ES6 Module,它是 ES6 中对模块的规范,ES6 是 ECMAScript 6.0 的简称,泛指 JavaScript 语言的下一代标准,它的第一个版本 ES2015 已经在 2015 年 6 月正式发布,本文中提到的 ES6 包括 ES2015、ES2016、ES2017等等。在第一节的《Web:一路前行一路忘川》中...

前端科普系列(3):CommonJS 不是前端却革命了前端

2020-07-09
阅读 14 分钟
2.3k
上一篇《前端科普系列(2):Node.js 换个角度看世界》,我们聊了 Node.js 相关的东西,Node.js 能在诞生后火到如此一塌糊涂,离不开它成熟的模块化实现,Node.js 的模块化是在 CommonJS 规范的基础上实现的。那 CommonJS 又是什么呢?

vivo悟空活动中台 - 微组件多端探索

2020-07-06
阅读 11 分钟
2.7k
本文首发于 vivo互联网技术 微信公众号  链接:[]([链接] [链接] 作者:悟空中台研发团队 【悟空活动中台】系列往期精彩文章: 《揭秘 vivo 如何打造千万级 DAU 活动中台 - 启航篇》 主要为大家讲述 vivo 活动中台的能力与创新。 《悟空活动中台 - 微组件状态管理(上)》介绍了活动页内 RSC 组件之间的状态管理和背后的...

深入学习和理解 Redux

2020-03-05
阅读 10 分钟
1.2k
Redux官网上是这样描述Redux,Redux is a predictable state container for JavaScript apps.(Redux是JavaScript状态容器,提供可预测性的状态管理)。 目前Redux GitHub有5w多star,足以说明 Redux 受欢迎的程度。

探究JS V8引擎下的“数组”底层实现

2019-12-17
阅读 7 分钟
2.7k
JavaScript 中的数组有很多特性:存放不同类型元素、数组长度可变等等,这与数据结构中定义的数组结构或者C++、Java等语言中的数组不太一样,那么JS数组的这些特性底层是如何实现的呢,我们打开V8引擎的源码,从中寻找到了答案。V8中对数组做了一层封装,使其有两种实现方式:快数组和慢数组,快数组底层是连续内存,通...

JavaScript 引擎 V8 执行流程概述

2019-12-16
阅读 7 分钟
3.4k
本文主要讲解的是V8的技术,是V8的入门篇,主要目的是了解V8的内部机制,希望对前端,快应用,浏览器,以及nodejs同学有些帮助。这里不涉及到如何编写优秀的前端,只是对JS内部引擎技术的讲解。

如何编写高质量的 JS 函数(4) --函数式编程[实战篇]

2019-11-11
阅读 11 分钟
2.9k
本文首发于 vivo互联网技术 微信公众号  链接:[链接] 作者:杨昆 【编写高质量函数系列】,往期精彩内容:《如何编写高质量的 JS 函数(1) -- 敲山震虎篇》介绍了函数的执行机制,此篇将会从函数的命名、注释和鲁棒性方面,阐述如何通过 JavaScript 编写高质量的函数。 《如何编写高质量的 JS 函数(2)-- 命名/注释/鲁...

为什么 JavaScript 中 0.1+0.2 不等于 0.3 ?

2019-10-28
阅读 3 分钟
3.1k
在 js 中进行数学的运算时,会出现0.1+0.2=0.300000000000000004的结果,一开始认为是浮点数的二进制存储导致的精度问题,但这似乎不能很好的解释为什么在同样的存储方式下0.3+0.4=0.7可以得到正确的结果。本文主要通过浮点数的二进制存储及运算,和IEEE754下的舍入规则,解释为何会出现这种情况。

如何编写高质量的 JS 函数(3) --函数式编程[理论篇]

2019-10-07
阅读 11 分钟
7.7k
本文首发于 vivo互联网技术 微信公众号  链接:[链接] 作者:杨昆 【编写高质量函数系列】中,《如何编写高质量的 JS 函数(1) -- 敲山震虎篇》介绍了函数的执行机制,此篇将会从函数的命名、注释和鲁棒性方面,阐述如何通过 JavaScript 编写高质量的函数。 《如何编写高质量的 JS 函数(2)-- 命名/注释/鲁棒篇》从函...