perf: 优化网站加载性能，移除外部依赖
- 移除 Tailwind CDN，内联实际使用的 CSS 类 - 移除 Google Fonts，改用系统字体 - 添加 SVG 网页图标 - 简化页面标题，只在 header 显示品牌信息 - 优化部署脚本，添加 SSH 连接加速参数 性能提升：消除 0.89s CDN 延迟，减少网络请求 Generated with [Devin](https://devin.ai) Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
selfrelease
@@ -1,5 +1,5 @@
|
||||
#!/bin/bash
|
||||
# 部署 Portal 到服务器
|
||||
# 部署 Portal 到服务器（优化版）
|
||||
# 用法: ./deploy.sh
|
||||
|
||||
SERVER="154.8.162.18"
|
||||
@@ -8,19 +8,15 @@ PASS="Why_701208"
|
||||
REMOTE_PATH="/var/www/portal"
|
||||
LOCAL_FILE="index.html"
|
||||
|
||||
echo "正在上传 ${LOCAL_FILE} 到 ${SERVER}:${REMOTE_PATH}..."
|
||||
sshpass -p "${PASS}" scp -o StrictHostKeyChecking=no "${LOCAL_FILE}" "${USER}@${SERVER}:${REMOTE_PATH}/${LOCAL_FILE}"
|
||||
# SSH 优化参数
|
||||
SSH_OPTS="-o StrictHostKeyChecking=no -o GSSAPIAuthentication=no -o ConnectTimeout=10 -o Compression=no -o Ciphers=aes128-ctr"
|
||||
|
||||
echo "正在上传 ${LOCAL_FILE} 并重载 Nginx..."
|
||||
sshpass -p "${PASS}" ssh ${SSH_OPTS} "${USER}@${SERVER}" "cat > ${REMOTE_PATH}/${LOCAL_FILE}" < "${LOCAL_FILE}" && \
|
||||
sshpass -p "${PASS}" ssh ${SSH_OPTS} "${USER}@${SERVER}" "nginx -s reload"
|
||||
|
||||
if [ $? -ne 0 ]; then
|
||||
echo "上传失败"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
echo "正在重载 Nginx..."
|
||||
sshpass -p "${PASS}" ssh -o StrictHostKeyChecking=no "${USER}@${SERVER}" "nginx -s reload"
|
||||
|
||||
if [ $? -ne 0 ]; then
|
||||
echo "Nginx 重载失败"
|
||||
echo "部署失败"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
|
||||
+214
-20
@@ -5,11 +5,218 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>AI 应用门户</title>
|
||||
<meta name="description" content="企业 AI Agent 统一门户，一站式访问所有智能应用" />
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700;800&display=swap" />
|
||||
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' style='stop-color:%236366f1'/%3E%3Cstop offset='100%25' style='stop-color:%238b5cf6'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='32' height='32' rx='6' fill='url(%23a)'/%3E%3Cpath d='M8 16c0-4.4 3.6-8 8-8s8 3.6 8 8-3.6 8-8 8-8-3.6-8-8zm8-6c-3.3 0-6 2.7-6 6s2.7 6 6 6 6-2.7 6-6-2.7-6-6-6z' fill='white' opacity='0.9'/%3E%3Ccircle cx='16' cy='16' r='2' fill='white'/%3E%3C/svg%3E" />
|
||||
<style>
|
||||
/* 内联 CSS 以提升加载速度 */
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* Tailwind 基础样式 */
|
||||
.antialiased {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.container {
|
||||
max-width: 640px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.container {
|
||||
max-width: 768px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.container {
|
||||
max-width: 1024px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1280px) {
|
||||
.container {
|
||||
max-width: 1280px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 布局类 */
|
||||
.flex { display: flex; }
|
||||
.flex-col { flex-direction: column; }
|
||||
.flex-row { flex-direction: row; }
|
||||
.flex-1 { flex: 1 1 0%; }
|
||||
.inline-flex { display: inline-flex; }
|
||||
.grid { display: grid; }
|
||||
.hidden { display: none; }
|
||||
.block { display: block; }
|
||||
.relative { position: relative; }
|
||||
.absolute { position: absolute; }
|
||||
.fixed { position: fixed; }
|
||||
.sticky { position: sticky; }
|
||||
.top-3 { top: 0.75rem; }
|
||||
.z-10 { z-index: 10; }
|
||||
.z-50 { z-index: 50; }
|
||||
|
||||
/* 间距类 */
|
||||
.gap-1\.5 { gap: 0.375rem; }
|
||||
.gap-2 { gap: 0.5rem; }
|
||||
.gap-3 { gap: 0.75rem; }
|
||||
.gap-4 { gap: 1rem; }
|
||||
.mb-1 { margin-bottom: 0.25rem; }
|
||||
.mb-2 { margin-bottom: 0.5rem; }
|
||||
.mb-2\.5 { margin-bottom: 0.625rem; }
|
||||
.mb-3 { margin-bottom: 0.75rem; }
|
||||
.mb-4 { margin-bottom: 1rem; }
|
||||
.mb-8 { margin-bottom: 2rem; }
|
||||
.mb-10 { margin-bottom: 2.5rem; }
|
||||
.mt-0\.5 { margin-top: 0.125rem; }
|
||||
.mt-1\.5 { margin-top: 0.375rem; }
|
||||
.mt-2\.5 { margin-top: 0.625rem; }
|
||||
.mt-3 { margin-top: 0.75rem; }
|
||||
.mt-10 { margin-top: 2.5rem; }
|
||||
.ml-2 { margin-left: 0.5rem; }
|
||||
.mx-auto { margin-left: auto; margin-right: auto; }
|
||||
.p-2 { padding: 0.5rem; }
|
||||
.p-4 { padding: 1rem; }
|
||||
.p-5 { padding: 1.25rem; }
|
||||
.p-6 { padding: 1.5rem; }
|
||||
.py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
|
||||
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
|
||||
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
|
||||
.py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
|
||||
.py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
|
||||
.px-2\.5 { padding-left: 0.625rem; padding-right: 0.625rem; }
|
||||
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
|
||||
.px-4 { padding-left: 1rem; padding-right: 1rem; }
|
||||
.pt-2\.5 { padding-top: 0.625rem; }
|
||||
.pt-5 { padding-top: 1.25rem; }
|
||||
.space-y-3 > * + * { margin-top: 0.75rem; }
|
||||
|
||||
/* 尺寸类 */
|
||||
.w-1\.5 { width: 0.375rem; }
|
||||
.w-2\.5 { width: 0.625rem; }
|
||||
.w-3 { width: 0.75rem; }
|
||||
.w-4 { width: 1rem; }
|
||||
.w-5 { width: 1.25rem; }
|
||||
.w-7 { width: 1.75rem; }
|
||||
.w-9 { width: 2.25rem; }
|
||||
.w-10 { width: 2.5rem; }
|
||||
.h-1\.5 { height: 0.375rem; }
|
||||
.h-2\.5 { height: 0.625rem; }
|
||||
.h-3 { height: 0.75rem; }
|
||||
.h-4 { height: 1rem; }
|
||||
.h-5 { height: 1.25rem; }
|
||||
.h-7 { height: 1.75rem; }
|
||||
.h-9 { height: 2.25rem; }
|
||||
.h-10 { height: 2.5rem; }
|
||||
.h-12 { height: 3rem; }
|
||||
.h-full { height: 100%; }
|
||||
.max-w-5xl { max-width: 64rem; }
|
||||
|
||||
/* 文本类 */
|
||||
.text-xs { font-size: 0.75rem; line-height: 1rem; }
|
||||
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
|
||||
.text-base { font-size: 1rem; line-height: 1.5rem; }
|
||||
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
|
||||
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
|
||||
.text-\[9px\] { font-size: 9px; }
|
||||
.text-\[10px\] { font-size: 10px; }
|
||||
.text-\[11px\] { font-size: 11px; }
|
||||
.font-medium { font-weight: 500; }
|
||||
.font-semibold { font-weight: 600; }
|
||||
.font-bold { font-weight: 700; }
|
||||
.font-extrabold { font-weight: 800; }
|
||||
.text-center { text-align: center; }
|
||||
.text-white { color: white; }
|
||||
.text-slate-100 { color: #f1f5f9; }
|
||||
.text-slate-400 { color: #94a3b8; }
|
||||
.text-slate-500 { color: #64748b; }
|
||||
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.text-ellipsis { text-overflow: ellipsis; }
|
||||
.whitespace-nowrap { white-space: nowrap; }
|
||||
.uppercase { text-transform: uppercase; }
|
||||
.tracking-tight { letter-spacing: -0.025em; }
|
||||
.tracking-\[0\.2em\] { letter-spacing: 0.2em; }
|
||||
.tracking-\[0\.22em\] { letter-spacing: 0.22em; }
|
||||
.leading-none { line-height: 1; }
|
||||
.leading-relaxed { line-height: 1.625; }
|
||||
|
||||
/* 背景类 */
|
||||
.bg-white { background-color: white; }
|
||||
.bg-white\/5 { background-color: rgba(255, 255, 255, 0.05); }
|
||||
.bg-white\/10 { background-color: rgba(255, 255, 255, 0.1); }
|
||||
.bg-emerald-400 { background-color: #34d399; }
|
||||
.bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)); }
|
||||
.from-indigo-500 { --tw-gradient-from: #6366f1; --tw-gradient-to: rgb(99 102 241 / 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
|
||||
.to-violet-500 { --tw-gradient-to: #8b5cf6; }
|
||||
|
||||
/* 边框类 */
|
||||
.border-b { border-bottom-width: 1px; }
|
||||
.border-t { border-top-width: 1px; }
|
||||
.border-white\/5 { border-color: rgba(255, 255, 255, 0.05); }
|
||||
.border-white\/10 { border-color: rgba(255, 255, 255, 0.1); }
|
||||
.ring-1 { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow); }
|
||||
.ring-white\/10 { --tw-ring-color: rgba(255, 255, 255, 0.1); }
|
||||
.rounded-full { border-radius: 9999px; }
|
||||
.rounded-xl { border-radius: 0.75rem; }
|
||||
|
||||
/* 阴影类 */
|
||||
.shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
|
||||
.shadow-\[0_0_12px_oklch\(0\.72_0\.18_150\)\] { box-shadow: 0 0 12px oklch(0.72 0.18 150); }
|
||||
|
||||
/* 交互类 */
|
||||
.cursor-pointer { cursor: pointer; }
|
||||
.hover\:ring-2:hover { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow); }
|
||||
.hover\:ring-violet-400\/50:hover { --tw-ring-color: rgba(167, 139, 250, 0.5); }
|
||||
.group-hover\:text-white:hover { color: white; }
|
||||
.opacity-0 { opacity: 0; }
|
||||
.overflow-hidden { overflow: hidden; }
|
||||
|
||||
/* 过渡类 */
|
||||
.transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
|
||||
.transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
|
||||
.transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
|
||||
.duration-500 { transition-duration: 500ms; }
|
||||
|
||||
/* Flex 工具类 */
|
||||
.items-center { align-items: center; }
|
||||
.items-start { align-items: flex-start; }
|
||||
.justify-center { justify-content: center; }
|
||||
.justify-between { justify-content: space-between; }
|
||||
.shrink-0 { flex-shrink: 0; }
|
||||
|
||||
/* 响应式类 */
|
||||
@media (min-width: 640px) {
|
||||
.sm\:block { display: block; }
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.md\:gap-4 { gap: 1rem; }
|
||||
.md\:inline-flex { display: inline-flex; }
|
||||
.md\:mb-10 { margin-bottom: 2.5rem; }
|
||||
.md\:p-6 { padding: 1.5rem; }
|
||||
.md\:py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
|
||||
.md\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
|
||||
.md\:text-xs { font-size: 0.75rem; line-height: 1rem; }
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
/* ===== Liquid Glass 主题变量 ===== */
|
||||
:root {
|
||||
@@ -140,7 +347,7 @@
|
||||
--refraction-color: oklch(0.5 0.05 265 / 0.06);
|
||||
}
|
||||
|
||||
* { font-family: 'Geist', 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
|
||||
* { font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
|
||||
html { font-size: 110%; scroll-behavior: smooth; }
|
||||
body {
|
||||
position: relative;
|
||||
@@ -758,20 +965,7 @@
|
||||
<!-- Main Content -->
|
||||
<main class="container mx-auto max-w-5xl px-4 py-10 md:py-14">
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="text-center mb-8 md:mb-10 animate-fade-in">
|
||||
<div class="inline-flex items-center gap-2 rounded-full px-3 py-1 mb-3 text-[10px] uppercase tracking-[0.2em] font-medium" style="background: var(--glass-bg); border: 1px solid var(--glass-border); color: var(--text-secondary); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);">
|
||||
<span class="h-1.5 w-1.5 rounded-full" style="background: var(--gradient-2); box-shadow: 0 0 8px var(--gradient-2);"></span>
|
||||
All by AI · 2026
|
||||
</div>
|
||||
<h1 class="text-2xl md:text-3xl font-extrabold tracking-tight mb-2" style="text-wrap: balance;">
|
||||
<span class="gradient-text">AI 智能应用中心</span>
|
||||
</h1>
|
||||
<p class="text-sm font-medium text-slate-400 mb-1">AI Application Hub</p>
|
||||
<p class="hero-subtitle text-slate-500 text-[11px] md:text-xs mx-auto leading-relaxed whitespace-nowrap overflow-hidden text-ellipsis">
|
||||
一站式访问所有智能应用，让 AI 赋能企业每一个环节<span class="sep"> · </span>One-stop access to all AI apps, empowering every business workflow
|
||||
</p>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- App Grid -->
|
||||
<section class="carousel-wrapper" id="carouselWrapper">
|
||||
|
||||
Reference in New Issue
Block a user