当前位置：首页 > article >正文

Web设计之登录网页源码分享，PHP数据库连接，可一键运行！

article 2025/6/8 21:01:20

HTML

页面结构（index.html）

1. 流星雨动态背景

2. 主体界面（包含登录和注册表单）

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="stylesheet" href="./css/login.css"><link rel="stylesheet" href="./font/iconfont.css"><link rel="icon" href="./src/images/capybara.png"><title>施霁の小屋</title>
</head>
<body><!-- 绘制流星雨 --><div class="meteor"><canvas id="canvas"></canvas></div><!-- 主体界面 --><div class="box"><!-- 登录 --><form action="" method="post"><div class="login-form"><dotlottie-player class='cat' src="https://lottie.host/a3033571-ac02-4729-a4d9-d26fb88daa07/HPJ1ubBluP.lottie" background="transparent" speed="1" direction="1" playMode="normal" loop autoplay></dotlottie-player><div class="pre-box"><h1>WELCOME</h1><div class="img-box"><img src="./src/images/boy.jpg" alt="user"></div></div><div class="title-box"><dotlottie-player src="https://lottie.host/e7669feb-3952-4f0f-aa68-68e9f217f9cc/ez4KCGLiEu.json" background="transparent" speed="1" style="width: 0.7rem; height: 0.7rem" direction="1" playMode="normal" loop autoplay></dotlottie-player><h1>Login</h1></div><div class="input-box"><input type="text" id="username" name="username"  placeholder="Username" required="required"><input type="password" id="password" name="password" placeholder="Password" required="required"></div><!-- <p class="login-error"></p> --><div class="btn-box"> <button type="submit" class="login" id="log">登 录</button></div><p class="click-msg" onclick="mySwitch()">没有账号？去注册</p></div></form><!-- 注册 --><form action="" method="post"><div class="register-form"><div class="title-box"><dotlottie-player src="https://lottie.host/772658ce-16ee-413d-96fc-b485d7ccae05/SshfRp85XJ.json" background speed="1" style="width: 0.7rem; height: 0.7rem" direction="1" playMode="normal" loop autoplay></dotlottie-player><h1>Register</h1></div><div class="input-box"><input type="text" id="username_1" name="username_1" placeholder="Username" required="required"><input type="password" id="password_1" name="password_1" placeholder="Password" required="required"><input type="email" id="email_1" name="email_1" placeholder="Email" required="required"></div><!-- <p class="register-error"></p> --><div class="btn-box"><button type="submit" class="register" id="rgs">注 册</button></div><p class="click-msg" onclick="mySwitch()">已有账号？去登录</p></div></form></div><!-- 设置遮盖移动效果 --><script src="./js/cover.js"></script><!-- 登录注册功能 --><script src="./js/Login.js"></script><script src="./js/register.js"></script><!-- 绘制流星雨 --><script src="./js/meteor.js"></script><script src="./js/jquery.js"></script><!-- 设置自适应效果 --><script src="./js/flexible.js"></script><!-- Lottie动画 --><script src="https://unpkg.com/@dotlottie/player-component@latest/dist/dotlottie-player.mjs" type="module"></script>
</body>
</html>

CSS

表单结构美化（login.css），部分动画依靠Lottie的调用

* {margin: 0;padding: 0;box-sizing: border-box;
}
input {outline: none;
}
html,
body {height: 100%;
}
body {display: flex;background: url(../src/images/your-name.jpg) no-repeat top fixed;overflow: hidden;background-size: cover;
}
.meteor {width: 100%;height: 100%;position: absolute;z-index: -1;
}
.meteor .canvas {filter: drop-shadow(0 0 1px white);
}
@font-face {font-family: "SNAP";src: url(../font/fonts/SNAP.TTF);
}
.title-box h1 {font-family: "SNAP";color: #ffffff;
}
/* 抖动画面 */
@keyframes jitter {0%,100% {/* 动画开始和结束时，元素保持原始状态 */transform: rotate(0deg);}25% {/* 动画的1/4处，元素向右旋转一个小角度 */transform: rotate(10deg);}50% {transform: rotate(5deg);}75% {/* 动画的3/4处，元素开始向左旋转 */transform: rotate(-5deg);}
}
.box {width: 8.3799rem;height: 5.3073rem;position: relative;display: flex;margin: auto;border-radius: .1397rem;border: .0279rem;box-shadow: 5px 4px 3px rgba(0, 0, 0, 0.1);
}.pre-box {position: absolute;width: 4.1899rem;height: 100%;top: 0;left: 0;border-radius: .1117rem;box-shadow: 5px 4px 3px rgba(0, 0, 0, 0.1);background: linear-gradient(#8de7f7, #87a5e8);transition: 0.5s ease-in-out;z-index: 1;
}
.pre-box h1 {margin-top: .419rem;color: white;letter-spacing: .0279rem;text-align: center;font-size: .6285rem;text-shadow: 5px 4px 3px rgba(0, 0, 0, 0.1);
}
.pre-box h1:hover {cursor: pointer;text-shadow: 5px 4px 3px rgba(9, 5, 230, 0.3);
}
.pre-box .img-box {width: 2.7933rem;height: 2.7933rem;margin: .2793rem auto;text-align: center;
}
.pre-box .img-box img {width: 80%;height: 80%;border-radius: 50%;margin-top: 30px;box-shadow: 5px 4px 3px rgba(0, 0, 0, 0.1);
}
.pre-box .img-box img:hover {animation: jitter 0.3s ease-in-out;
}
form {flex: 1;height: 100%;
}
.login-form,
.register-form {position: relative;height: 100%;
}
.title-box {display: flex;justify-self: center;align-items: center;flex-direction: column;height: 1.3966rem;line-height: 0.35rem;
}
.title-box h1 {text-align: center;font-size: .6285rem;
}
.input-box {display: flex;flex-direction: column;align-items: center;
}
.input-box input {width: 70%;height: .419rem;margin: .1397rem;padding: .0698rem .0698rem .0698rem .3911rem;font-size: .2235rem;border: 1px solid #b0cfe9;border-radius: 3px;background-repeat: no-repeat;background-size: .2235rem;background-position: 5px center;
}input[type="text"] {background-image: url(../src/images/user.png);
}
input[type="password"] {background-image: url(../src/images/pwd.png);
}
input[type="email"] {background-image: url(../src/images/email.png);
}
/* .login-error,
.register-error {height: .419rem;padding: .0698rem auto;margin-top: 10px;color: #99eef7;text-align: center;font-weight: bold;
} */
.btn-box {position: absolute;bottom: 30px;left: 50%;transform: translateX(-50%);display: flex;justify-content: center;
}
.btn-box button {border: none;width: .838rem;height: .419rem;border-radius: .0419rem;margin: .1397rem;font-size: .2235rem;background-color: #69b3f0;color: white;
}
.btn-box button:hover {cursor: pointer;opacity: 0.8;
}.click-msg {position: absolute;bottom: 10px;left: 25%;text-align: center;color: #69b3f0;font-size: .2514rem;
}
.click-msg:hover {cursor: pointer;color: #99eef7;
}.cat {position: absolute;width: 40px;height: 40px;bottom: 40px;left: 50%;transform: translate(-50%);
}

JS

控制代码

1. 流星雨控制（meteor.js）（注意，流星雨需要jquery，需要下载到本地或者通过链接调用code.jquery.com/jquery-3.7.1.min.js，这个链接内容是源码，复制到本地js文件即可）

let canvas = document.querySelector("#canvas")
/** @type {CanvasRenderingContext2D} */
let ctx = canvas.getContext("2d")
canvas.width = window.innerWidth
canvas.height = window.innerHeight
let meteors = []
let allstar = 40function init() {for (let i = 0; i < allstar; i++){newmeteor();}
}function resizeCanvas() {canvas.width = window.innerWidth;canvas.height = window.innerHeight;
}function newmeteor() {meteors.push({lines:[{x: parseInt(Math.random() * canvas.width),y: parseInt(Math.random() * canvas.height * 0.7)}],life: parseInt(Math.random() * 100 + 100),age: 0})
}function draw() {ctx.clearRect(0, 0, canvas.width, canvas.height)var flag = falsefor(let i = 0; i < meteors.length; i++){meteor = meteors[i]lines = meteor.linesflag = !flagfor(let j = 0; j < lines.length; j++){ctx.fillStyle = `rgba(255, 255, 255, ${j / lines.length})`ctx.fillRect(lines[j].x, lines[j].y, 1, 1)}ctx.fillStyle = 'yellow'// 流星头部let head = lines[lines.length - 1]ctx.fillRect(head.x, head.y, 1, 1)ctx.fillRect(head.x - 1, head.y, 1, 1)ctx.fillRect(head.x + 1, head.y, 1, 1)ctx.fillRect(head.x, head.y - 1, 1, 1)ctx.fillRect(head.x, head.y + 1, 1, 1)if(meteor.age <= meteor.life / 2){lines.push({x: head.x - 1,y: head.y + 0.51})}else{lines.shift()}meteor.age++if(meteor.age >= meteor.life){meteors.splice(i, 1)newmeteor()}}
}// function setup() {
//     init();
//     window.addEventListener('resize', resizeCanvas);
//     setInterval(draw, 12);
// }// setup();init();
setInterval(draw, 12);

2. 登录表单动画（cover.js）

let flag = true;
const mySwitch = () => {if(flag) {$(".pre-box").css("transform", "translateX(100%)");$(".pre-box").css("background", "linear-gradient(rgb(131, 184, 204), rgb(18, 48, 138))");$(".img-box img").attr("src", "./src/images/girl.jpg");}else {$(".pre-box").css("transform", "translateX(0%)");$(".pre-box").css("background", "linear-gradient(rgb(141, 231, 247), rgb(135, 165, 232))");$(".img-box img").attr("src", "./src/images/boy.jpg");}flag = !flag;
};

3. 页面自适应（flexible.js）

(function flexible(window, document) {var docEl = document.documentElement;var dpr = window.devicePixelRatio || 1;// adjust body font sizefunction setBodyFontSize() {if (document.body) {document.body.style.fontSize = 12 * dpr + "px";} else {document.addEventListener("DOMContentLoaded", setBodyFontSize);}}setBodyFontSize();// set 1rem = viewWidth / 10function setRemUnit() {var rem = docEl.clientWidth / 20;docEl.style.fontSize = rem + "px";}setRemUnit();// reset rem unit on page resizewindow.addEventListener("resize", setRemUnit);window.addEventListener("pageshow", function(e) {if (e.persisted) {setRemUnit();}});// detect 0.5px supportsif (dpr >= 2) {var fakeBody = document.createElement("body");var testElement = document.createElement("div");testElement.style.border = ".5px solid transparent";fakeBody.appendChild(testElement);docEl.appendChild(fakeBody);if (testElement.offsetHeight === 1) {docEl.classList.add("hairlines");}docEl.removeChild(fakeBody);}
})(window, document);

4. 登录控制（Login.js）

document.addEventListener("DOMContentLoaded", function() {  var btn = $("#log");  var errorMsg = $(".login-error"); // 获取错误消息的元素  errorMsg.css("font-size", ".2235rem"); // 设置文字大小为16像素// 使用jQuery绑定点击事件  $(btn).click(function(e) {  e.preventDefault(); // 阻止表单的默认提交行为  var username = $("#username").val(); // 获取用户名  var password = $("#password").val(); // 获取密码  // 发送AJAX请求  $.ajax({  url: "../php/Login.php", // PHP处理文件的路径  type: "POST",  data: { // 发送的数据  "username": username,  "password": password  },  success: function(response) {  // 根据PHP返回的结果进行处理  if (response === "success") {  location.href = "../首页.html"; // 登录成功，跳转到主页  console.log("success");  errorMsg.text(''); // 清除错误消息} else {  console.log("failed");  errorMsg.text("登录失败，请检查您的账号和密码！");// alert("登录失败，请检查您的账号和密码！");  }  },  error: function(xhr, status, error) {  // 处理请求失败的情况  // alert("请求失败: " + error);  errorMsg.text("请求失败: " + error);setTimeout(function() {// 3秒后清空errorMsg的文本内容errorMsg.text("");}, 3000); // 3000毫秒等于3秒}  });  });  
});

5. 注册控制（register.js）

document.addEventListener("DOMContentLoaded", function() {  var btn = $("#rgs");  var errorMsg = $(".register-error"); // 获取错误消息的元素 errorMsg.css("font-size", ".2235rem"); // 设置文字大小为16像素 // 使用jQuery绑定点击事件  $(btn).click(function(e) {  e.preventDefault(); // 阻止表单的默认提交行为  var username = $("#username_1").val(); // 获取用户名  var password = $("#password_1").val(); // 获取密码 var email = $("#email_1").val(); // 获取邮箱// 发送AJAX请求  $.ajax({  url: "../php/register.php", // PHP处理文件的路径  type: "POST",  data: { // 发送的数据  "username": username,  "password": password,"email": email},  success: function(response) {   // 根据PHP返回的结果进行处理  if (response.trim() === "success") {errorMsg.text('注册成功， 去登录叭~'); // 清除错误消息}else if (response.trim() === "exist") {  errorMsg.text("该用户已经存在了嗷~");  }else {errorMsg.text("注册失败，请稍后再试~");// alert("注册失败，请稍后再试~")  }},  error: function(xhr, status, error) {  errorMsg.text("请求失败: " + error);// alert("请求失败: " + error);setTimeout(function() {// 3秒后清空errorMsg的文本内容errorMsg.text("");}, 3000); // 3000毫秒等于3秒}  });  });  
});

MySQL

使用PHP连接数据库，这里是基础功能的实现，需要先创建一个数据库，基本步骤如下：

1. 进入MySQL，输入你的密码

2. 创建数据库，这里取名为web

3. 在该数据库下创建一个表user，用来存放用户登录注册信息

4. 向表中插入一些数据用于登录

5. 插入结果

6. 分配一个用户（wang）可对web中的所有表执行任何操作（可选）

PHP

（代码很简单，看注释即可）

1. 登录控制（Login.php）

<?php  
// 数据库配置信息  
$host = 'localhost'; // 数据库服务器地址  
$dbuser = 'wang'; // 数据库用户名  
$dbpwd = 'Wxl020403.'; // 数据库密码  
$dbname = 'web'; // 数据库名  // 表单提交数据  
$username = trim($_POST['username']); // 去除前后空格  
$password = trim($_POST['password']); // 去除前后空格  // 创建连接  
$conn = new mysqli($host, $dbuser, $dbpwd, $dbname);  // 检查连接  
if ($conn->connect_error) {  die("连接失败: " . $conn->connect_error);  
}else{// $selectSQL = "SELECT * FROM user WHERE username='{$username}' AND password='{$password}'";// $result = $conn->query($selectSQL);// if ($result->num_rows == 1) {//     echo "success";// }// else{//     echo "error";// }// 准备SQL语句  $stmt = $conn->prepare("SELECT * FROM user WHERE username=? AND password=?");  // 绑定参数  $stmt->bind_param("ss", $username, $password);  // 执行查询  $stmt->execute();  // 获取结果  $result = $stmt->get_result();  // 检查是否有行返回  if ($result->num_rows == 1) {  echo "success";  } else {  echo "error";  }  // 关闭语句和连接  $stmt->close();  $conn->close();  
}
?>

2. 注册控制（register.php）

<?php// 数据库配置信息  
$host = 'localhost'; // 数据库服务器地址  
$dbuser = 'wang'; // 数据库用户名  
$dbpwd = 'Wxl020403.'; // 数据库密码  
$dbname = 'web'; // 数据库名  // 创建连接  
$conn = new mysqli($host, $dbuser, $dbpwd, $dbname);  $username = trim($_POST['username']); // 去除前后空格  
$password = trim($_POST['password']); // 去除前后空格  
$email = trim($_POST['email']);// 检查连接  
if ($conn->connect_error) {  die("连接失败: " . $conn->connect_error);  
}// 使用预处理语句检查用户是否已存在  
$stmt = $conn->prepare("SELECT 1 FROM user WHERE username = ?");  
$stmt->bind_param("s", $username);  
$stmt->execute();  
$stmt->store_result();  if ($stmt->num_rows > 0) {  echo "exist";  $stmt->close();  $conn->close();  exit;  
}  // 用户不存在，插入新用户，非常简单的判断
$stmt = $conn->prepare("INSERT INTO user (username, password, email) VALUES (?, ?, ?)");  
$stmt->bind_param("sss", $username, $password, $email);  if($stmt->execute()) {  echo "success";exit;
}
else{echo "error";exit;
}  $stmt->close();  
$conn->close();  ?>

Web设计之登录网页源码分享，PHP数据库连接，可一键运行！

HTML 页面结构（index.html） 1. 流星雨动态背景 2. 主体界面（包含登录和注册表单） <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport&qu…...

编程日记 2025/6/8 21:01:20

Cursor + Claude 4：微信小程序流量主变现开发实战案例

前言随着微信小程序生态的日益成熟，越来越多的开发者开始关注如何通过小程序实现流量变现。本文将详细介绍如何使用Cursor编辑器结合Claude 4 AI助手，快速开发一个具备流量主变现功能的微信小程序，并分享实际的开发经验和变现策略。项目…...

编程日记 2025/6/8 21:00:15

㊗️高考加油

以下是极为详细的高考注意事项清单，涵盖考前、考中、考后全流程，建议逐条核对： 一、考前准备 1. 证件与物品必带清单： 准考证：打印2份（1份备用），塑封或夹在透明文件袋中防皱湿。身…...

编程日记 2025/6/8 20:59:13

Redis Key过期策略

概述 Redis的Key过期策略是其内存管理系统的核心组成部分，主要包括「被动过期」、「主动过期」和「内存淘汰」三个机制。其中「内存淘汰」相关内容已经在上一篇「Redis内存淘汰策略」中进行了详细的讲解，有信兴趣的同学可以在回顾上一篇文章。本文将着重…...

编程日记 2025/6/8 20:57:59

【C/C++】实现固定地址函数调用

在 C 里，函数地址在程序运行期间通常是固定的，不过在动态链接库（DLL）或者共享库（SO）中，函数地址可能会因为地址空间布局随机化（ASLR）而改变。所以我们想要通过地址直接调…...

编程日记 2025/6/8 20:56:57

Math-PUMA: Progressive Upward Multimodal Alignment to Enhance Mathematical Reasoning ➡️ 论文标题：Math-PUMA: Progressive Upward Multimodal Alignment to Enhance Mathematical Reasoning ➡️ 论文作者：Wenwen Zhuang, Xin Huang, Xiantao Z…...

编程日记 2025/6/8 20:55:52

性能优化笔记

性能优化转载 https://www.cnblogs.com/tengzijian/p/17858112.html 性能优化的一般策略及方法简言之，非必要，不优化。先保证良好的设计，编写易于理解和修改的整洁代码。如果现有的代码很糟糕，先清理重构，然后再考…...

编程日记 2025/6/8 20:54:48

bat批量去掉本文件夹中的文件扩展名

本文本夹内批量去掉本文件夹中的文件扩展名假如你有一些文件，你想去掉他们的扩展名有没有方便的办法呢今天我们就分享一种办法。下面，就来看看吧。首先我们新建一个记事本，把名字改为，批量去掉本文件夹中的文件扩展名.txt 然…...

编程日记 2025/6/8 20:53:43

基于ROS2，撰写python脚本，根据给定的舵-桨动力学模型实现动力学更新

提问 #! /usr/bin/env python3from control_planner import usvParam as P from control_planner.courseController import courseLimitationimport tf_transformations # ROS2没有自带tf.transformations, 需装第三方库 import rclpy from rclpy.node import Node from pid_…...

编程日记 2025/6/8 20:52:36

Scrapy爬虫教程（新手）

1. Scrapy的核心组成引擎（engine）：scrapy的核心，所有模块的衔接，数据流程梳理。调度器（scheduler）：本质可以看成一个集合和队列，里面存放着一堆即将要发送的请求&#…...

编程日记 2025/6/8 20:51:31

数据可视化大屏案例落地实战指南：捷码平台7天交付方法论

分享大纲： 1、落地前置：数据可视化必备的规划要素 2、数据可视化双路径开发 3、验证案例：数据可视化落地成效在当下数字化转型浪潮中，数据可视化建设已成为关键环节。数据可视化大屏的落地，成为企业数据可视化建设的难…...

编程日记 2025/6/8 20:50:27

第五篇：Go 并发模型全解析——Channel、Goroutine

第五篇：Go 并发模型全解析——Channel、Goroutine 一、序章：Java 的并发往事在 Java 世界中，说到“并发”，你可能立马想到以下名词：Thread、Runnable、ExecutorService、synchronized、volatile。再复杂点，ReentrantLock、CountDownLatch、BlockingQueue 纷纷登场，仿…...

编程日记 2025/6/8 20:49:21

锁的艺术：深入浅出讲解乐观锁与悲观锁

在多线程和分布式系统中，数据一致性是一个核心问题。锁机制作为解决并发冲突的重要手段，被广泛应用于各种场景。乐观锁和悲观锁是两种常见的锁策略，它们在设计理念、实现方式和适用场景上各有特点。本文将深入探讨乐观锁和悲观锁的原理、实现…...

编程日记 2025/6/8 20:48:17

在网页加载时自动运行js的方法（2025最新）

在网页加载时自动运行JavaScript方法有多种实现方式，以下是常见的几种方法： 1. 使用 DOMContentLoaded 事件当初始HTML文档完全加载和解析后触发（无需等待图片等资源加载）： document.addEventListener(DOMC…...

编程日记 2025/6/8 20:47:09

在Windows下编译出llama_cpp_python的DLL后，在虚拟环境中使用方法

定位编译生成的文件在VS2022编译完成后，在构建目录（如build/Release或build/Debug）中寻找以下关键文件： ggml.dll、ggml_base.dll、ggml_cpu.dll、ggml_cuda.dll、llama.dll（核心动态链接库） llama_cp…...

编程日记 2025/6/8 20:46:07

CSS radial-gradient函数详解

目录基本语法关键参数详解 1. 渐变形状（Shape） 2. 渐变大小（Size） 3. 中心点位置（Position） 4. 颜色断点（Color Stops） 常见应用场景 1. 基本圆形渐变 2. 椭圆渐变 3. 模…...

编程日记 2025/6/8 20:45:06

n8n 自动化平台 Docker 部署教程（附 PostgreSQL 与更新指南）

n8n 自动化平台 Docker 部署教程（附 PostgreSQL 与更新指南） n8n 是一个强大的可视化工作流自动化工具，支持无代码或低代码地集成各种服务。本文将手把手教你如何通过 Docker 快速部署 n8n，并介绍如何使用 PostgreSQL、设置时区以…...

编程日记 2025/6/8 20:44:04

关于datetime获取时间的问题

import datetime print(datetime.now())如果用上述代码，会报错： 以下才是正确代码： from datetime import datetime print(datetime.now()) 结果： 如果想格式化时间，使用代码： from datetime import da…...

编程日记 2025/6/8 20:43:03

前端面试五之vue2基础

1.属性绑定v-bind（：） v-bind 是 Vue 2 中用于动态绑定属性的核心指令，它支持多种语法和用法，能够灵活地绑定 DOM 属性、组件 prop，甚至动态属性名。通过 v-bind，可以实现数据与视图之间的高效同…...

编程日记 2025/6/8 20:42:02

使用python实现奔跑的线条效果

效果，展示（视频效果展示）： 奔跑的线条 from turtle import * import time t1Turtle() t2Turtle() t3Turtle() t1.hideturtle() t2.hideturtle() t3.hideturtle() t1.pencolor("red") t2.pencolor("green") t3…...

编程日记 2025/6/8 20:41:00

Oracle 审计参数：AUDIT_TRAIL 和 AUDIT_SYS_OPERATIONS

Oracle 审计参数：AUDIT_TRAIL 和 AUDIT_SYS_OPERATIONS 一 AUDIT_TRAIL 参数 1.1 参数功能 AUDIT_TRAIL 是 Oracle 数据库中最核心的审计控制参数，决定审计记录的存储位置和记录方式。 1.2 参数取值及含义取值说明适用场景NONE禁用数据库审计测试环…...

编程日记 2025/6/8 20:39:58

Android LinearLayout、FrameLayout、RelativeLayout、ConstraintLayout大混战

一、为什么布局性能如此重要？ 在Android应用中，布局渲染耗时直接决定了界面的流畅度。根据Google官方数据，超过60%的卡顿问题源于布局性能不佳。本文将彻底解析三大传统布局的性能奥秘，并提供可直接落地的优化方案。二、三大布局…...

编程日记 2025/6/8 20:38:55

Unity版本使用情况统计（更新至2025年5月）

UWA发布｜本期UWA发布的内容是Unity版本使用统计（第十六期），统计周期为2024年11月至2025年5月，数据来源于UWA网站（www.uwa4d.com）性能诊断提测的项目。希望给Unity开发者提供相关的行业趋势作为参…...

编程日记 2025/6/8 20:37:52

GPUCUDA 发展编年史：从 3D 渲染到 AI 大模型时代（上）

目录文章目录目录1960s~1999：GPU 的诞生：光栅化（Rasterization）3D 渲染算法的硬件化实现之路学术界算法研究历程工业界产品研发历程光栅化技术原理光栅化技术的软件实现：OpenGL 3D 渲染管线设计 1. 顶点处理&…...

编程日记 2025/6/8 20:35:35

人机融合智能 | 可穿戴计算设备的多模态交互

可穿戴计算设备可以对人体以及周围环境进行连续感知和计算,为用户提供随时随地的智能交互服务。本章主要介绍人机智能交互领域中可穿戴计算设备的多模态交互,阐述以人为中心的智能穿戴交互设计目标和原则,为可穿戴技术和智能穿戴交互技术的设计提供指导,进而简述支持智能穿戴交…...

编程日记 2025/6/8 20:34:34

Impromptu VLA：用于驾驶视觉-语言-动作模型的开放权重和开放数据

25年5月来自清华和博世的论文“Impromptu VLA: Open Weights and Open Data for Driving Vision-Language-Action Models”。用于自动驾驶的“视觉-语言-动作” (VLA) 模型前景光明，但在非结构化极端场景下却表现不佳，这主要是由于缺乏有针对性的基准测…...

编程日记 2025/6/8 20:33:30