- 博客(483)
- 收藏
- 关注
RSS订阅原创 Three.js 实战【1】—— 3D全景视图开发
我们先看一下这篇文章主要要实现的一个demo效果，现如今在第三方租房、买房App、或者百度、高德地图上会出现这种全景视图，当手势操作时，他对应的景色也会发生一定的变化。又或者你最近刷抖音看到了HM玩的图寻，给了一张可以旋转的3D全景图片，然后找这张图片在哪拍摄的，你可能会好奇这种效果在前端是如何实现的。这就是这篇文章将会教会你的一个小demo。
2023-05-17 09:32:50
224
原创 探索三维世界【4】：Three.js & dat.gui & gsap 的使用
该文为读者介绍了如何使用 Three.js、dat.gui 和 gsap 三个 JavaScript 库来创建逼真的 3D 图形界面。首先介绍了 Three.js 的基本概念和用途，并提供了一些实际代码示例，帮助初学者快速上手。然后，该文章重点讲解了 dat.gui 在 Three.js 中的应用。dat.gui 是一个轻量级 JavaScript 库，它可以帮助用户添加交互式控制面板，使用户能够在 3D 场景中调整对象参数并实时预览结果。
2023-05-16 09:46:47
172
原创 探索三维世界【3】：Three.js 的 Geometry 几何体 与 Material 材质
最后将几何体与材质通过Mesh对象创建，Mesh是构成3D物体的基本单元之一，它是由Geometry和Material组合而成的。在使用Three.js创建物体时，需要将Geometry传入到Mesh对象中，Mesh对象则用于定义物体的材质和纹理等属性。Geometry包含了物体的顶点、面、法线、UV映射、颜色等信息，它可以定义各种各样的形状，例如三角形、矩形、圆形、立方体等等。需要注意的是，使用Geometry创建物体时，需要手动计算并设置物体的法线以及UV映射等属性，这一过程有些繁琐。
2023-05-04 20:11:21
371
原创 探索三维世界【2】：Three.js 的 Texture 纹理
你可以使用 TextureLoader 加载网页中的图像，然后在场景中创建一个新的纹理对象，并将其应用到任何需要的物体表面上。纹理是指将一张图像映射到 three.js 场景中的物体表面上的过程。在进行创建纹理加载器时，直接通过THREE父类进行创建，之后通过load方法进行加载图片到对应的纹理对象上。因此，TextureLoader 和 Texture 以及其子类之间是一种解耦的关系，TextureLoader 负责纹理的加载和创建工作，而 Texture 及其子类则负责实现具体的纹理效果和属性。
2023-05-02 12:56:19
581
原创 瘦身SpringBoot：优化项目打包大小的方法
现有的应用开发中，不论是单体架构、微服务架构，如果项目采用的是 springboot、springcloud 来作为底层框架，打包时最终都会以jar包的方式打包、部署。这是就会面临一个问题，就是 jar 包非常大，单体应用还好，但是如果是微服务就非常痛苦，几十个微服务就要拆分打包几十个 jar 包，每个 jar 包都很大(几百M)，合起来就好几个 GB，非常占用空间。
2023-04-12 15:01:42
233
原创 探索三维世界：从Hello World开始的Three.js入门之旅
Three.js是一款基于WebGL的JavaScript库，它可以帮助开发者快速构建3D场景和动画效果。它提供了丰富的API，包括几何体、材质、光源、相机等组件，可以实现复杂的3D交互。Three.js还支持多种导入格式，包括OBJ、Collada、FBX等，可以方便地将3D模型导入到场景中。入门Three.js需要掌握WebGL的基础知识，因为Three.js是基于WebGL的，所以对于WebGL的了解可以帮助更好地理解Three.js的原理和使用。
2023-04-07 16:47:20
346
原创 Vue3为什么要使用组合式API——Vue3的组合式API和Vue2的选项式API的优缺点
使用组合式API的主要原因是为了更好的解决组件复杂性和代码重用性的问题。组合式API将组件的逻辑按照功能进行划分，将相关逻辑放在一起，使得代码更加清晰和易于维护。同时，组合式API还可以更好地利用TypeScript等静态类型检查工具，提高代码的可靠性和稳定性。组合式API还提供了一些新的特性，例如响应式API、生命周期钩子函数的重命名、setup函数等，这些新特性使得组合式API更加强大和灵活。
2023-03-24 21:07:52
926
2
原创 Vue3 组合式API（setup、ref、reactive、computed、watch、hook、shallow、provide ）详解
Vue3中的自定义hook是通过使用函数式组件和Composition API实现的。自定义hook可以将重复的逻辑提取出来，使代码更加简洁和易于维护。要创建一个自定义hook，可以定义一个函数，该函数接受参数并返回一个对象或数组，该对象或数组可供组件使用。
2023-03-24 17:40:29
474
原创 深入底层——浅谈Vue2和Vue3的响应式数据实现原理
在 JavaScript 中有两种劫持 property 访问的方式：getter / setters 和 Proxies。Vue 2 使用 getter / setters 完全是出于支持旧版本浏览器的限制。而在 Vue 3 中则使用了 Proxy 来创建响应式对象，仅将 getter / setter 用于 ref。
2023-03-18 16:34:41
924
原创 不一样的邂逅——初识Vue3
Vue3.0 版本代表了 2 年多的开发工作，包括 30+ RFC、2，600+ 提交、来自 628 个贡献者的 99 个拉取请求，以及核心存储库之外的大量开发和文档工作。Vue 是为社区创建并由社区维护的独立项目，如果没有您的持续支持，Vue 3.0 是不可能的。这里直接从对应的官网上获取其打包的一个说明流程图。
2023-03-17 17:55:38
781
1
原创 nginx七大核心应用场景详解 & 解决生产中的实际问题 & 二次开发扩展
HTTP的keep-alive一般我们都会带上中间的横杠，普通的http连接是客户端连接上服务端，然后结束请求后，由客户端或者服务端进行http连接的关闭。动静分离指的就是将部署在tomcat服务器（或目标服务器）上的静态资源进行抽离出来单独部署在nginx上，这样一个请求打过来，直接就可以通过nginx将静态资源（img/css/js/mp4）进行返回，而其他的动态请求再打到后续的tomcat等服务器上，这样也就降低了后续服务器的压力，也减少了网络传输下的大静态资源文件的压力。
2023-03-06 21:49:15
721
1
原创 Jenkins环境搭建与实战
Jenkins是一个可扩展的持续集成引擎。持续集成，就是通常所说的CI（Continues Integration），可以说是现代软件技术开发的基础。持续集成是一种软件开发实践，即团队开发成员经常集成他们的工作，通常每个成员至少集成一次，也意味着每天可能会发生多次集成。每次集成都通过自动化的构建（包括编译，发布，自动化测试）来验证，从而尽快地发现集成错误。许多团队发现这个过程可以大大减少集成的问题，让团队能够更快的开发内聚的软件。
2023-01-28 19:59:05
1011
1
原创 开源之路——如何发布属于自己的npm包
在进行开发的过程当中，难免会出现一些重复性的工作，例如说我们要对一个数组对象按照某一个字段进行大小排序，又或者说把Promise对象进行封装，把AJAX请求也进行封装，但是在后续的开发过程当中，更换项目后，再去找之前的代码很难去定位到对应的位置，这个时候自定义npm包就显得额外重要了，有时候就会想像这种loadsh这种提供了很多种对应的函数、对象等这种方法是如何实现的，为什么他只需要执行一个npm命令，就可以直接使用对应封装好的方法，这个就是本篇将要说的。
2022-12-19 14:52:48
562
原创 JAVA 设计模式篇
设计模式是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结。它描述了在软件设计过程中的一些不断重复发生的问题，以及该问题的解决方案。也就是说，它是解决特定问题的一系列套路，是前辈们的代码设计经验的总结，具有一定的普遍性，可以反复使用。
2022-12-01 16:31:42
644
原创 分布式锁？我一手synchronized 什么高并发，什么秒杀通通拿下（狗头）
分布式锁？我一手synchronized 什么高并发，什么秒杀通通拿下（狗头）
2022-09-27 18:03:52
3645
3
原创 js设计模式-观察者模式与发布订阅模式
在对于现在前端框架的崛起，大家对发布订阅这几个字也很熟悉了，像Vue用到的VueX以及React框架用的Pubsub都是发布订阅模式，简单来说，我们只需要在一个地方通知（发布）修改一个变量、对象的值，而在另一个地方进行订阅该变量、对象就可以获取到改变之后的值。
2022-09-01 20:35:09
381
原创 微服务项目调用外部接口
微服务开发过程当中，并且是在进行多项目开发时，难免的会出现调用别人开发的接口获取数据这种场景，但是到这里通常可以以下两种方式进行调用获取。（后端调用）
2022-08-31 09:01:52
761
原创 React 详解
React是用于构建用户界面的JavaScript库， [1] 起源于Facebook的内部项目，该公司对市场上所有 JavaScript MVC框架都不满意，决定自行开发一套，用于架设Instagram的网站。
2022-08-19 10:17:40
484
原创 webpack5 打包工具 详解
webpack 是一种前端资源构建工具，一个静态模块打包器(module bundler)。 在 webpack 看来, 前端的所有资源文件(js/json/css/img/less/...)都会作为模块处理。 它将根据模块的依赖关系进行静态分析，打包生成对应的静态资源(bundle)。
2022-05-29 15:06:48
1041
1
原创 Spring Security 认证授权详解
Spring Security 是 Spring 家族中的成员。Spring Security 基于 Spring 框架，提供了一套 Web 应用安全性的完整解决方案。在对与安全方面的两个主要区域是“认证”和“授权”（或者访问控制），一般来说，Web 应用的安全性包括用户认证（Authentication）和用户授权（Authorization）两个部分，这两点也是 Spring Security 重要核心功能。
2022-05-03 14:10:32
3994
原创 我的三周年创作纪念日
今天是2022-04-24星期天，今天由于五一调休要补班，早上还是和往常上班的早上一样，早上点开csdn的时候突然的发现自己写博客一下子有三年了，时间过的好快，昨天还是一个学生今天就已经是一个打工人了机缘首先的话可能就是跟大多数人一样，也是在读书的时候进行开始写博客的，基本上也就是对平时上课的一些点进行记录。从最开始的对java数组的一个小记录，最开始也只是一个小菜鸡，想的就是将上课的代码和知识点进行一下整理记录，有时候没事的时候也可以直接在手机上面看了，不用很麻烦的去开电脑了。而自己刚开始写博客也只
2022-04-24 17:09:16
833
3
原创 Vue 使用 vis-network 绘制网络关系图
visjs 提供了一个网络视图模块，提供给我们绘制网络之间的各个点、线之间的关系，这个的话就比较类似于echarts的地图，在地图上打点画线的逻辑，区别在于使用visjs可以拖动节点的位置、以及visjs里面还有对物理引擎等的引入。网络是一种可视化，用于显示由节点和边组成的网络和网络。可视化易于使用，并支持自定义形状、样式、颜色、大小、图像等。网络可视化可在任何现代浏览器上流畅运行，最多可容纳数千个节点和边。为了处理大量节点，Network 支持集群。
2022-04-20 15:23:23
4995
2
原创 Nuxt SSR 服务端渲染 详解
Nuxt.js 支持基于 Vue 应用程序生成静态站点。这是“两全其美”的，因为你不要服务器，但是仍能获得 SEO 的好处，这是因为 Nuxt 将预先渲染所有页面，并且包括必要的 HTML。
2022-04-16 16:33:51
3853
原创 使用 html2canvas 生成图片
html2canvas允许您直接在用户浏览器上对网页或其部分进行“截图”。屏幕截图基于 DOM，因此可能不是 100% 准确到真实表示，因为它不会制作实际的屏幕截图，而是根据页面上可用的信息构建屏幕截图。
2022-04-16 15:18:40
2192
1
原创 使用Echarts根据经纬度给地图画点画线
在使用Echar进行绘制地图对象，首先我们需要地图的json文件，Echarts依赖默认会引入这个相关的json文件，所以后续使用这个地图可以之间引用这里的json文件进行绘制Echarts地图。但是在后续重新构建项目的时候发现了一个问题，Echarts的依赖包下没有这个map文件了，我心想这不人麻了，这json文件我要去哪找。后面再对比版本之后发现，在5.0版本之前Echarts会默认将这些Map的json文件进行打包,但是在5.0之后就不会对这个进行打包加入到依赖之中了
2022-04-09 09:46:29
9350
10
原创 XXL-JOB 分布式任务调度 详解
任务调度也可以称为定时任务，简单来说：任务调度（定时任务）就是在某一时刻部署的服务自动执行对应的任务（操作）。
2022-04-05 21:52:01
6075
原创 Activiti 工作流引擎 详解
工作流(Workflow)，就是通过计算机对业务流程自动化执行管理。它主要解决的是“使在多个参与者之间按照某种预定义的规则自动进行传递文档、信息或任务的过程，从而实现某个预期的业务目标，或者促使此目标的实现”。
2022-01-06 21:51:00
17673
6
原创 Minio 分布式文件系统详解 分别使用java与js操作
Minio 对象存储：对象存储最大的优势就在于它可以存储大容量的非结构化数据，例如图片、视频、日志文件、备份数据和容器/虚拟机镜像等。
2022-01-02 16:05:47
1963
原创 ElasticSearch 分布式搜索引擎 详解
The Elastic Stack, 包括 Elasticsearch、Kibana、Beats 和 Logstash（也称为 ELK Stack）。能够安全可靠地获取任何来源、任何格式的数据，然后实时地对数据进行搜索、分析和可视化。Elaticsearch，简称为 ES，ES 是一个开源的高扩展的分布式全文搜索引擎，是整个 Elastic Stack 技术栈的核心。它可以近乎实时的存储、检索数据；本身扩展性很好，可以扩展到上百台服务器，处理 PB 级别的数据。
2021-12-23 14:30:42
1499
原创 redis 分布式缓存 详解
Redis命令操作、Redis持久化、Spring整合Redis、Redis的分布式缓存、主从复制、哨兵监测、集群搭建、分布式Session实现
2021-12-17 23:05:56
2660
原创 ShardingJDBC 分库分表详解
Apache ShardingSphere 是一套开源的分布式数据库解决方案组成的生态圈，它由 JDBC、Proxy 和 Sidecar（规划中）这 3 款既能够独立部署，又支持混合部署配合使用的产品组成。 它们均提供标准化的数据水平扩展、分布式事务和分布式治理等功能，可适用于如 Java 同构、异构语言、云原生等各种多样化的应用场景。
2021-12-01 22:08:28
9620
1
原创 Docker与Docker-Compose详解
对docker容器的设计简单来说，对于不同的环境都给抽离出来进行分层，就比如说很多的软件服务（比如说：Naocs、ES、Hadoop等等）都需要jdk的环境，那再进行拉取镜像的时候，这些镜像都会先检验jdk的环境，再进行后续的安装，那这里装个Naocs、ES、Hadoop要下载三次JDK，这显然浪费了很多的内存，所以在这里Docker采用了分层的原理，这里每一层的环境依赖都给分开了，再一次安装了jdk环境之后，后续安装的服务也要jdk依赖就不会再去拉取了，回直接使用本地有的jdk环境。
2021-11-21 21:24:57
13714
5
原创 Spring Cloud Alibaba 微服务解决方案 详解
1、Spring Cloud Alibaba1、Spring Cloud Alibaba概述官网地址：https://spring.io/projects/spring-cloud-alibabaSpring Cloud Alibaba 为分布式应用开发提供一站式解决方案。它包含开发分布式应用程序所需的所有组件，使您可以轻松地使用 Spring Cloud 开发应用程序。使用Spring Cloud Alibaba，您只需添加一些注解和少量配置，即可将Spring Cloud应用连接到阿里巴巴的分布
2021-11-13 13:24:39
1137
原创 Spring Cloud 微服务解决方案 详解
SpringCloud, 基于SpringBoot提供了一套微服务解决方案，包括服务注册与发现，配置中心，全链路监控，服务网关，负载均衡，熔断器等组件，除了基于NetFlix的开源组件做高度抽象封装之外，还有一些选型中立的开源组件。
2021-11-01 17:06:34
2183
2
原创 NodeJs——对数据库CRUD
学生成绩管理系统在这里使用数据库进行获取数据：先进行建表，建表的数据如下图所示：在numjs当中找到第三方库mysql：npm.js /mysql使用命令进行安装npm install mysql之后我们在npm.js当中进行查看mysql的使用：简单的连接：复制上面的代码进行简单的测试，看连接数据库是否成功var mysql = require('mysql')var connection = mysql.createConnection({ host: 'localhost',
2021-08-23 11:01:33
202
原创 RabbitMQ 交换机、死信、SpringBoot整合以及集群的搭建
RabbitMQ 消息传递模型的核心思想是: 生产者生产的消息从不会直接发送到队列。实际上，通常生产者甚至都不知道这些消息传递传递到了哪些队列中。相反，生产者只能将消息发送到交换机(exchange)，交换机工作的内容非常简单，一方面它接收来自生产者的消息，另一方面将它们推入队列。交换机必须确切知道如何处理收到的消息。是应该把这些消息放到特定队列还是说把他们到许多队列中还是说应该丢弃它们。这就的由交换机的类
2021-08-08 13:20:52
204
原创 消息中间件之RabbitMQ的安装及消息发送接收
安装erlang官网地址：https://www.erlang.org/downloads选择对应本机的版本
2021-08-04 22:53:34
423
1
原创 TypeScript 详解
TypeScript是什么？TS和JS的区别TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。TS开发环境的搭建有两种主要的方式来获取TypeScript工具：通过npm（Node.js包管理器
2021-07-24 21:27:13
4184
4
原创 JMeter 压力测试
JMeter压力测试首先下载JMeter：https://jmeter.apache.org/download_jmeter.cgi下载之后直接进行解压缩，在bin目录下，双击运行jar包即可打开工具之后简单来说，先准备一个接口，在这里启动项目使用一个findAll接口之后在JMeter当中添加测试计划，在下方添加线程（用户）=> 线程组，给定线程数，这里的线程数也就是发送请求的次数。在线程组下添加 取样器 => HTTP请求，将http请求添加进来，选择对应的请求参数等配置
2021-07-17 10:35:43
187
1
原创 JWT 详解
JWT是什么？JSON Web Token (JWT)是一个开放标准(RFC 7519)，它定义了一种紧凑的、自包含的方式，用于作为JSON对象在各方之间安全地传输信息。该信息可以被验证和信任，因为它是数字签名的。
2021-07-13 21:03:21
6321
9
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人