@umacloud/knowledge 1.0.1

package/development/01-standards/performance-optimization-complete.md

@@ -0,0 +1,289 @@
+---
+id: performance-optimization-complete
+title: 性能优化完整指南
+domain: development
+category: 01-standards
+difficulty: intermediate
+tags: [complete, development, optimization, performance, 代码优化, 前端优化, 异步处理, 性能分析]
+quality_score: 70
+last_updated: 2026-06-15
+---
+# 性能优化完整指南
+
+## 概述
+性能优化是提升应用响应速度、吞吐量和资源利用率的过程。本指南覆盖性能分析、优化策略和最佳实践。
+
+## 1. 性能分析
+
+**Python性能分析**:
+```python
+import cProfile
+import pstats
+
+def profile_function():
+    profiler = cProfile.Profile()
+    profiler.enable()
+    
+    # 需要分析的代码
+    expensive_operation()
+    
+    profiler.disable()
+    stats = pstats.Stats(profiler)
+    stats.sort_stats('cumulative')
+    stats.print_stats(10)
+```
+
+**内存分析**:
+```python
+import memory_profiler
+
+@memory_profiler.profile
+def memory_intensive_function():
+    data = [i for i in range(1000000)]
+    return sum(data)
+```
+
+## 2. 数据库优化
+
+**查询优化**:
+```python
+# ❌ N+1查询
+for user in users:
+    posts = db.query(Post).filter_by(user_id=user.id).all()
+
+# ✅ 使用JOIN
+users = db.query(User).options(joinedload(User.posts)).all()
+
+# ✅ 批量查询
+user_ids = [user.id for user in users]
+posts = db.query(Post).filter(Post.user_id.in_(user_ids)).all()
+```
+
+**索引优化**:
+```sql
+-- 创建索引
+CREATE INDEX idx_users_email ON users(email);
+CREATE INDEX idx_posts_user_date ON posts(user_id, created_at);
+
+-- 分析查询计划
+EXPLAIN ANALYZE SELECT * FROM users WHERE email = 'alice@example.com';
+```
+
+## 3. 缓存策略
+
+**Redis缓存**:
+```python
+import redis
+import json
+
+r = redis.Redis()
+
+def get_user(user_id):
+    # 先查缓存
+    cached = r.get(f'user:{user_id}')
+    if cached:
+        return json.loads(cached)
+    
+    # 查数据库
+    user = db.query(User).get(user_id)
+    
+    # 写入缓存
+    r.setex(f'user:{user_id}', 3600, json.dumps(user.to_dict()))
+    
+    return user
+```
+
+**应用层缓存**:
+```python
+from functools import lru_cache
+
+@lru_cache(maxsize=128)
+def expensive_calculation(n):
+    return sum(i ** 2 for i in range(n))
+```
+
+## 4. 异步处理
+
+**Celery任务队列**:
+```python
+from celery import Celery
+
+app = Celery('tasks', broker='redis://localhost:6379')
+
+@app.task
+def send_email(to, subject, body):
+    # 异步发送邮件
+    pass
+
+# 调用
+send_email.delay('user@example.com', 'Hello', 'Body')
+```
+
+**异步IO**:
+```python
+import asyncio
+import aiohttp
+
+async def fetch_url(url):
+    async with aiohttp.ClientSession() as session:
+        async with session.get(url) as response:
+            return await response.text()
+
+async def fetch_all(urls):
+    tasks = [fetch_url(url) for url in urls]
+    return await asyncio.gather(*tasks)
+```
+
+## 5. 代码优化
+
+**列表推导式**:
+```python
+# ❌ 慢
+result = []
+for i in range(1000):
+    result.append(i ** 2)
+
+# ✅ 快
+result = [i ** 2 for i in range(1000)]
+```
+
+**字符串拼接**:
+```python
+# ❌ 慢
+result = ''
+for word in words:
+    result += word
+
+# ✅ 快
+result = ''.join(words)
+```
+
+**使用内置函数**:
+```python
+# ❌ 慢
+total = 0
+for num in numbers:
+    total += num
+
+# ✅ 快
+total = sum(numbers)
+```
+
+## 6. 前端优化
+
+**代码分割**:
+```javascript
+// React懒加载
+const LazyComponent = React.lazy(() => import('./HeavyComponent'))
+
+// 路由级分割
+const routes = [
+  {
+    path: '/dashboard',
+    component: React.lazy(() => import('./Dashboard'))
+  }
+]
+```
+
+**资源压缩**:
+```javascript
+// vite.config.js
+export default {
+  build: {
+    minify: 'terser',
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          vendor: ['react', 'react-dom'],
+          utils: ['lodash', 'axios']
+        }
+      }
+    }
+  }
+}
+```
+
+## 7. 网络优化
+
+**CDN加速**:
+```html
+<!-- 使用CDN -->
+<script src="https://cdn.jsdelivr.net/npm/react@18/umd/react.production.min.js"></script>
+```
+
+**HTTP缓存**:
+```python
+from flask import Flask, make_response
+
+app = Flask(__name__)
+
+@app.route('/static/data')
+def get_data():
+    response = make_response(data)
+    response.headers['Cache-Control'] = 'public, max-age=3600'
+    return response
+```
+
+## 最佳实践
+
+### ✅ DO
+
+1. **先分析,后优化**
+```bash
+python -m cProfile -s cumulative app.py
+```
+
+2. **使用缓存**
+```python
+@lru_cache(maxsize=128)
+def expensive_function():
+    pass
+```
+
+3. **批量操作**
+```python
+# ✅ 好
+db.bulk_insert_mappings(User, user_data_list)
+```
+
+### ❌ DON'T
+
+1. **不要过早优化**
+```python
+# ❌ 过度优化简单逻辑
+if condition:
+    pass
+```
+
+2. **不要忽略索引**
+```sql
+-- ❌ 差: 全表扫描
+SELECT * FROM users WHERE LOWER(email) = 'alice@example.com';
+```
+
+## 学习路径
+
+### 初级 (1-2周)
+1. 性能分析工具
+2. 基础优化技巧
+3. 缓存使用
+
+### 中级 (2-3周)
+1. 数据库优化
+2. 异步处理
+3. 网络优化
+
+### 高级 (2-4周)
+1. 分布式缓存
+2. 负载均衡
+3. 性能监控
+
+---
+
+**知识ID**: `performance-optimization-complete`  
+**领域**: development  
+**类型**: standards  
+**难度**: intermediate  
+**质量分**: 94  
+**维护者**: dev-team@umadev.com  
+**最后更新**: 2026-03-28

package/development/01-standards/playwright-complete.md

@@ -0,0 +1,247 @@
+---
+id: playwright-complete
+title: Playwright端到端测试完整指南
+domain: development
+category: 01-standards
+difficulty: intermediate
+tags: [complete, development, playwright, 学习路径, 最佳实践, 核心概念, 概述]
+quality_score: 70
+last_updated: 2026-06-15
+---
+# Playwright端到端测试完整指南
+
+## 概述
+Playwright是现代化的Web测试框架,支持Chromium、Firefox、WebKit。本指南覆盖测试编写、页面交互、断言和最佳实践。
+
+## 核心概念
+
+### 1. 基础测试
+
+**配置Playwright**:
+```javascript
+// playwright.config.js
+module.exports = {
+  use: {
+    baseURL: 'http://localhost:3000',
+    headless: true,
+    viewport: { width: 1280, height: 720 }
+  }
+};
+```
+
+**简单测试**:
+```javascript
+// tests/login.spec.js
+const { test, expect } = require('@playwright/test');
+
+test('login flow', async ({ page }) => {
+  await page.goto('/login');
+  
+  await page.fill('#email', 'user@example.com');
+  await page.fill('#password', 'password');
+  await page.click('button[type="submit"]');
+  
+  await expect(page).toHaveURL('/dashboard');
+  await expect(page.locator('h1')).toContainText('Welcome');
+});
+```
+
+### 2. 页面交互
+
+**点击和输入**:
+```javascript
+test('form submission', async ({ page }) => {
+  await page.goto('/contact');
+  
+  // 填写表单
+  await page.fill('#name', 'Alice');
+  await page.fill('#email', 'alice@example.com');
+  await page.fill('#message', 'Hello World');
+  
+  // 点击提交
+  await page.click('button[type="submit"]');
+  
+  // 验证成功消息
+  await expect(page.locator('.success')).toBeVisible();
+});
+```
+
+**下拉菜单和复选框**:
+```javascript
+test('select and checkbox', async ({ page }) => {
+  await page.goto('/settings');
+  
+  // 选择下拉选项
+  await page.selectOption('#country', 'China');
+  
+  // 勾选复选框
+  await page.check('#notifications');
+  
+  // 验证
+  expect(await page.isChecked('#notifications')).toBeTruthy();
+});
+```
+
+### 3. 等待和断言
+
+**等待元素**:
+```javascript
+test('wait for element', async ({ page }) => {
+  await page.goto('/dynamic');
+  
+  // 等待元素出现
+  await page.waitForSelector('.loaded', { timeout: 5000 });
+  
+  // 等待文本
+  await page.waitForSelector('text=Success');
+  
+  // 等待URL
+  await page.waitForURL('/success');
+});
+```
+
+**断言**:
+```javascript
+test('assertions', async ({ page }) => {
+  await page.goto('/user/1');
+  
+  // 元素可见
+  await expect(page.locator('.profile')).toBeVisible();
+  
+  // 包含文本
+  await expect(page.locator('.name')).toContainText('Alice');
+  
+  // 属性
+  await expect(page.locator('input')).toHaveAttribute('type', 'email');
+  
+  // 数量
+  await expect(page.locator('.item')).toHaveCount(5);
+});
+```
+
+### 4. API Mock
+
+**拦截请求**:
+```javascript
+test('mock API', async ({ page }) => {
+  // 拦截API请求
+  await page.route('**/api/users', route => {
+    route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify([{ id: 1, name: 'Mock User' }])
+    });
+  });
+  
+  await page.goto('/users');
+  
+  await expect(page.locator('.user-name')).toContainText('Mock User');
+});
+```
+
+### 5. 视觉测试
+
+**截图对比**:
+```javascript
+test('visual regression', async ({ page }) => {
+  await page.goto('/homepage');
+  
+  // 截图并对比
+  await expect(page).toHaveScreenshot('homepage.png');
+});
+
+// 允许差异
+test('visual with threshold', async ({ page }) => {
+  await page.goto('/dashboard');
+  
+  await expect(page).toHaveScreenshot('dashboard.png', {
+    maxDiffPixels: 100
+  });
+});
+```
+
+### 6. 多浏览器测试
+
+```javascript
+// projects config
+module.exports = {
+  projects: [
+    { name: 'chromium', use: { browserName: 'chromium' } },
+    { name: 'firefox', use: { browserName: 'firefox' } },
+    { name: 'webkit', use: { browserName: 'webkit' } }
+  ]
+};
+
+// 测试自动运行在所有浏览器
+test('cross browser', async ({ page, browserName }) => {
+  await page.goto('/');
+  await expect(page.locator('h1')).toBeVisible();
+});
+```
+
+## 最佳实践
+
+### ✅ DO
+
+1. **使用Page Object Model**
+```javascript
+// pages/LoginPage.js
+class LoginPage {
+  constructor(page) {
+    this.page = page;
+    this.emailInput = '#email';
+    this.passwordInput = '#password';
+    this.submitButton = 'button[type="submit"]';
+  }
+  
+  async login(email, password) {
+    await this.page.fill(this.emailInput, email);
+    await this.page.fill(this.passwordInput, password);
+    await this.page.click(this.submitButton);
+  }
+}
+
+// 使用
+test('login with page object', async ({ page }) => {
+  const loginPage = new LoginPage(page);
+  await loginPage.login('user@example.com', 'password');
+});
+```
+
+### ❌ DON'T
+
+1. **不要使用固定等待**
+```javascript
+// ❌ 差
+await page.waitForTimeout(1000);
+
+// ✅ 好
+await page.waitForSelector('.loaded');
+```
+
+## 学习路径
+
+### 初级 (1周)
+1. 基础测试
+2. 页面交互
+3. 等待和断言
+
+### 中级 (2-3周)
+1. API Mock
+2. 视觉测试
+3. Page Object Model
+
+### 高级 (2-3周)
+1. 自定义Fixtures
+2. 测试报告
+3. CI/CD集成
+
+---
+
+**知识ID**: `playwright-complete`  
+**领域**: development  
+**类型**: standards  
+**难度**: intermediate  
+**质量分**: 94  
+**维护者**: testing-team@umadev.com  
+**最后更新**: 2026-03-28