共计 12 篇文章

打造 Vue 技术栈中的“时间宝石“

现代浏览器的功能越来越强大,前端需要处理的业务逻辑也越来越复杂,提供良好的交互是我们一直追求的事,而我们在做的可视化报表工具,有一个重要的提升用户体验的功能,撤销 & 重做,这个功能给用户以安全感和保障,用户不会担心所做的操作以及交互会消失掉,不可追溯。为了实现这个功能,我调研了一些实现方式,有基于 Immutable 数据结构的,有基于栈 数据结构去管理的,我们的实际项目使用 Vuex ...

使用 Proxy 构建响应式系统

💡本篇博文可能学到的知识点更好的理解 Vue 响应式工作原理学习 Vue 的设计模式学习 Proxy API使用 Proxy 实现观察者模式现代前端开发必不可少会用到的 Vue、React 等框架,这些框架的共同之处在于都提供了响应式(Reactive)和组件化(Composable)的视图组件,组件化开发重新定义了前端开发技术栈。结合前端构建工具以及基于框架出现的各种经过精心设计的UI组件库,让前端也进入到了一个工程化的时代。 ...

📊 搭建基于 Cube.js 的 Vue Dashboard

Cube.jsCube.js - 一个完整的开源数据分析解决方案:提供高性能的大规模数据集分析技术基础架构,同时提供前端友好的API,用于构建仪表盘报表以及其他数据分析应用,它扮演了前端与后端之间的数据层角色。Cube.js 客户端执行查询,Cube.js 后端将业务逻辑(dimensions 和 measures 以及 filters) ...

🚀 记一次前端性能优化

工作中一直在做一款公司内部的BI工具,将数据可视化的报表赋能给业务人员,报表配置者通过简单的拖拽操作即可生成报表。随着系统不断的完善,加上运维推广,我们积累了越来越多的用户。这时候用户体验的方方面面都体现出来了。我们也停下产品的功能迭代,将整个系统进行优化,旨在提升用户体验。以下是我对前端项目的优化总结。Webpack 打包优化项目中在使用的 Webpack 版本是3.x,本次优化的方案仍然是基于Webpack3.x版本的 Vue 脚手架进行优化。 ...

使用 Drag and Drop 给Web应用提升交互体验

什么是 Drag and Drop (拖放)? 简单来说,HTML5 提供了 Drag and Drop API,允许用户用鼠标选中一个可拖动元素,移动鼠标拖放到一个可放置到元素的过程。 我相信每个人都或多或少接触过拖放,比如浏览器多标签页之间的可拖放排序、手机中的App可以随便拖放排序等等,Drag and Drop ...