Clay 的技术空间

用进废退 | 艺不压身

发表于 更新于 评论数： 本文字数： 857 阅读时长 ≈ 1 分钟

大纲

Vue CLI 安装

CLI 是 Command-Line Interface (命令行界面) 的缩写，俗称脚手架。Vue CLI 是一个由 Vue 官方提供的、快速生成 Vue 工程化项目的工具，可以快速搭建 Vue 开发环境以及创建对应的 Webpack 配置文件。在使用 Vue 开发大型应用时，往往需要考虑代码目录结构、项目结构和部署、热加载、单元测试等事情；如果每个项目都要手动完成这些工作，那无以效率比较低效，所以通常会使用一些脚手架工具来帮助完成这些事情。

版本区别

Vue CLI 目前拥有两个版本，分别是 Vue CLI 2 和 Vue CLI 3，两者的区别如下：

  • Vue CLI 3 提供了 vue ui 命令，提供了可视化配置，更加人性化
  • Vue CLI 3 是基于 Webpack 4 打造，Vue CLI 2 是基于 Webpack 3 打造
  • Vue CLI 3 的设计原则是 零配置，移除了配置文件根目录下的 build 和 config 等目录
  • Vue CLI 3 移除了 static 文件夹，新增了 public 文件夹，并且将 index.html 移动到 public 文件夹中
阅读全文 »

发表于 更新于 评论数： 本文字数： 3.4k 阅读时长 ≈ 3 分钟

大纲

Vue 指令介绍

什么是指令

  • 指令（Directives）是带有 v- 前缀的特殊特性
  • 指令特性的预期值是：单个 JavaScript 表达式
  • 指令的职责是，当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM（视图）。
阅读全文 »

发表于 更新于 评论数： 本文字数： 2.7k 阅读时长 ≈ 2 分钟

大纲

前言

MVVM 思想

  • M：即 Model（模型），包括数据和一些基本操作
  • V：即 View（视图），页面的渲染结果
  • VM：即 View-Model，模型与视图间的双向操作（无需开发人员干涉）

在 MVVM 之前，开发人员从后端获取需要的数据模型，然后要通过 DOM 操作 Model 渲染到 View 中。当用户操作视图后，开发人员还需要通过 DOM 获取 View 中的数据，然后同步到 Model 中。而 MVVM 中的 VM 要做的事情就是把 DOM 操作完全封装起来，开发人员不用再关心 Model 和 View 之间是如何互相影响的。这样可以将开发人员从繁琐的 DOM 操作中解放出来，把关注点放在如何操作 Model 上。

阅读全文 »

发表于 评论数： 本文字数： 1.7k 阅读时长 ≈ 2 分钟

前言

限流概述

在开发高并发系统时可以用三把利器来保护系统：缓存、降级和限流。缓存的目的是提升系统访问速度和增大系统处理的容量，是抗高并发流量的 “银弹”；而降级是当服务出现问题或者影响到核心流程时，需要暂时将其屏蔽掉，待高峰过去之后或者问题解决后再打开；而有些场景并不能用缓存和降级来解决，比如稀缺资源（秒杀、抢购）、写服务（如评论、下单）、频繁的复杂查询等，因此需要有一种手段来限制这些场景的并发 / 请求量，即限流。限流的目的是通过对并发访问 / 请求进行限速或者对一个时间窗口内的请求进行限速来保护系统，一旦达到限制速率则可以拒绝服务（定向到错误页或友好的展示页）、排队或等待（比如秒杀、评论、下单等场景）、降级（返回兜底数据或默认数据）。主流的中间件都会有单机限流框架，一般支持两种限流模式：控制速率和控制并发。Spring Cloud Zuul 通过第三方扩展 spring-cloud-zuul-ratelimit 也可以支持限流，而 Spring Cloud Gateway 的限流实现可以看这里。常见的限流算法有漏桶和令牌桶，计数器也可以进行粗暴限流实现。对于限流算法，可以参考 Guava 中的 RateLimiter、Bucket4j、RateLimitJ 等项目的具体实现。

Bucket4j 介绍

Bucket4j 是基于令牌桶算法的 Java 限流库，它主要用在 3 种场景：

  • 限制比较重工作的速率
  • 限制对 API 的访问速率
  • 将限流作为定时器，例如有些场景限制你对服务提供方的调用速度，因此使用限流器作为定时器，定时按照约定速率调用服务提供方
阅读全文 »

发表于 评论数： 本文字数： 352 阅读时长 ≈ 1 分钟

思路分析

为了实现数组的快速排序，可以采用分而治之的思想，将数组拆分为多个小的数组，然后再进行排序，最后将所有小数组的排序结果汇总在一起，如下图所示：

阅读全文 »

发表于 评论数： 本文字数： 4.2k 阅读时长 ≈ 4 分钟

大纲

1、UidGenerator 分布式 ID 生成器

1.1、概述

UidGenerator 由百度开源并使用 Java 实现的，基于 Snowflake 算法的唯一 ID 生成器。UidGenerator 以组件形式工作在应用项目中， 支持自定义 workerId 位数和初始化策略， 从而适用于 Docker 等虚拟化环境下实例自动重启、漂移等场景。在实现上， UidGenerator 通过借用未来时间来解决 sequence 天然存在的并发限制；采用 RingBuffer 来缓存已生成的 UID， 并行化 UID 的生产和消费， 同时对 CacheLine 补齐，避免了由 RingBuffer 带来的硬件级「伪共享」问题。 最终单机 QPS 可达 600 万。依赖 Java8 及以上版本， MySQL（内置 WorkerID 分配器， 启动阶段通过数据库进行分配；如自定义实现，则数据库非必选依赖）。

阅读全文 »

发表于 评论数： 本文字数： 6k 阅读时长 ≈ 5 分钟

大纲

1、分布式 ID 简介

1.1、业务背景

在复杂的分布式系统中，往往需要对大量的数据和消息进行唯一标识。比如在美团点评的金融、支付、餐饮、酒店、猫眼电影等产品的系统中数据日渐增长，对数据分库分表后需要有一个唯一 ID 来标识一条数据或消息。具体一点的如订单、骑手、优惠劵也都需要有唯一标识，此时一个能够生成全局唯一 ID 的系统是非常必要的。

阅读全文 »

发表于 更新于 评论数： 本文字数： 2.7k 阅读时长 ≈ 2 分钟

前言

Next 8.x 原生的暗黑模式

Next 8.x 主题已经原生支持暗黑模式，只需要在 Next 的 _config.yml 配置文件中，将相应的开关打开即可（如下所示）：

1
darkmode: true

Next 8.x 主题原生暗黑模式的优缺点：

  • 优点：
    • 配置非常简单
  • 缺点：
    • 缺少切换按钮，默认是根据系统偏好（系统是否处于暗黑模式）来决定是否启用
阅读全文 »