Shader 学习笔记
基本概念 Shader（着色器）是用来描述顶点和像素如何在 GPU 上处理的程序。每个着色器都包含了两个类型的着色器，分别是顶点着色器 Vertex Shader 和 片段着色器 Fragment Shader.顶点着色器定位几何体的每个顶点坐标。片段着色器用于为几何体的每个可见像素着色。 Attributes 顶点特有的数据，只在顶点着色器中使用。 属性是每个顶点独有的数据，例如顶点的位置、法线…
基本概念 Shader（着色器）是用来描述顶点和像素如何在 GPU 上处理的程序。每个着色器都包含了两个类型的着色器，分别是顶点着色器 Vertex Shader 和 片段着色器 Fragment Shader.顶点着色器定位几何体的每个顶点坐标。片段着色器用于为几何体的每个可见像素着色。 Attributes 顶点特有的数据，只在顶点着色器中使用。 属性是每个顶点独有的数据，例如顶点的位置、法线…
安装 基础概念 基本使用 坐标 在 PIXI.js 中的坐标同 html 坐标一致，原点从页面左上方开始 图形 Graphics 将基本形状（如线条，圆形，矩形等）渲染到显示器，并为他们添加样式。页可以使用 Graphics 对象构建图形。 PIXI.js 官方文档：Graphics Bilibili 视频教程：02-Pixi图形Graphics具体应用 常用图形类型 属性与方法 文字 Text …
React Three Fiber 基于 Three.js，是 Three.js 的 React 绑定，为 React 开发者提供了一种简单、直观的方式来创建和管理 3D 场景。
Promise 是 JavaScript 中处理异步操作的一种机制。它是一种表示异步操作最终完成或失败的对象。
Axios 是一个基于 Promise 的 HTTP 客户端，用于浏览器和 Node.js。它是一个流行的 JavaScript 库，用于在客户端与服务器之间进行 HTTP 请求和响应。
TypeScript 是 JavaScript 的超集。这意味着任何有效的 JavaScript 代码也是有效的 TypeScript 代码，但 TypeScript 提供了额外的静态类型检查和其他语言功能。
整理了Gutenberg编辑器开发的常用方法与组件。
概述 https://www.bilibili.com/video/BV11r4y1n7Sj?p=1 Redux 是 JavaScript 应用的状态容器，提供可预测的状态管理。 使用场景 功能特点 为什么 React 要使用 Redux React 是 DOM 的一个抽象层（UI 库），并不是 Web 应用的完整解决方案，因此 React 在涉及到数据的处理以及组件之间的通信时比较复杂。对于大型…
lenis 是一款用于实现网页平滑滚动的轻量级 JS 插件。 安装 引入 配置 lerp 属性值则是控制滚动平滑程度，数值越小，滚动平滑越明显 插件主页 https://github.com/studio-freight/lenis
概述 Webpack 是一种前端资源构建工具，静态模块打包器 ( module bundler )。在 Webpack 看来，前端的所有资源文件 ( js / json / css / img / less / … ) 都会作为模块处理。它将根据模块的依赖关系进行静态分析，打包生成对应的静态资源 ( module )。 基础使用 安装 首先使用 npm init 初始化项目，然后安装 …
Ajax 基础概念与使用方法以及封装 Ajax 函数。
hover-effect.js 插件提供了及具个性的鼠标悬浮时图片切换效果，需配合 three.js 和 gsap.js 共同使用。
three.js 的基础入门以及常用方法与属性。
判断页面的滚动方向是往上还是往下滚动或是否滚动到最顶部
数据转换 parseInt() 解析一个字符串并返回指定基数的十进制整数 parseFloat() Boolean() JSON.parse() 将文本字符串转换为 JSON 数据 字符串 split() 将字符串按照制定的符号进行分割 trim() 从一个字符串的两端删除空白字符，不影响原先的字符串本身，将返回一个新的字符串。 includes() 是否包含其中的字符串 ${} 可以直接在模版字…
typeof 用于判断基本数据类型，判断复杂数据类型时返回值都是 object constructor 可以判断复杂数据类型，但无法判断 undefined 和 null 类型 instanceof 无法判断基本数据类型，但可精确判断复杂数据类型 语法结构 “对象 instanceof 构造函数” Object.portotype.toString.call 可以判断所有数据类型 语法结构：“Ob…
PUJI Design 朴及设计 (c) 2024. 沪ICP备17052229号