Hello World
Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub. Quick StartCreate a new post1$ hexo new "My New Post" More info: Writing Run server1$ hexo server More info: Server Generate static files1$ hexo generate More info: Generating Deploy to remote sites1$ hexo deploy More info: Deployment
Hexo + Butterfly 主题配置完全指南
本文详细介绍如何配置 Hexo 博客框架和 Butterfly 主题，打造一个美观且功能强大的个人博客。 为什么选择 Hexo + ButterflyHexo 是一个快速、简洁且高效的静态博客框架，而 Butterfly 主题则是 Hexo 生态中最受欢迎的主题之一，具有以下特点： 🎨 美观的界面设计：现代化的 UI 设计，支持多种配色方案 🚀 丰富的功能：内置搜索、评论、分享等多种功能 📱 响应式布局：完美适配各种设备 ⚡ 性能优化：支持 PJAX、懒加载等性能优化 🔧 高度可定制：通过配置文件轻松自定义各种功能 安装步骤1. 安装 Hexo1234npm install -g hexo-clihexo init my-blogcd my-blognpm install 2. 安装 Butterfly 主题12git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterflynpm install hexo-renderer-pug hexo-rend...
前端性能优化实践总结
在前端开发中，性能优化是一个永恒的话题。本文总结了我在实际项目中积累的性能优化经验。 页面加载优化资源压缩与合并 使用 Webpack 或 Vite 进行代码打包 压缩 JavaScript、CSS 和 HTML 使用 Gzip 或 Brotli 压缩 12345678// webpack.config.jsconst TerserPlugin = require('terser-webpack-plugin');module.exports = { optimization: { minimizer: [new TerserPlugin()], },}; 图片优化 使用 WebP 格式替代 JPEG/PNG 实现图片懒加载 使用 CDN 加速图片加载 1<img src="placeholder.jpg" data-src="actual-image.jpg" loading="lazy" alt="描述"&...
JavaScript ES6+ 新特性完全掌握
ES6（ECMAScript 2015）是 JavaScript 历史上最重要的更新之一，引入了大量新特性。本文将详细介绍这些特性及其使用场景。 let 和 constES6 引入了块级作用域的变量声明方式： 12345678910111213// let - 可变变量let count = 0;count = 1;// const - 常量const PI = 3.14159;// PI = 3; // TypeError// 块级作用域{ let blockScoped = '只在块内有效';}// console.log(blockScoped); // ReferenceError 箭头函数箭头函数提供了更简洁的语法，并且不绑定 this： 1234567891011121314151617181920// 传统函数function add(a, b) { return a + b;}// 箭头函数const add = (a, b) => a + b;// 单参数可省略括号const double ...
Git 工作流最佳实践
Git 是目前最流行的分布式版本控制系统。本文分享 Git 工作流的最佳实践，帮助团队更高效地协作。 分支管理策略Git FlowGit Flow 是一种经典的分支模型： 123456master (main) ─────●────────────●──────> \ ^ \ /develop ●────────●────●──────────●───> \ \ \ /feature ●──●──● hotfix ●──●────●──●──●──> 主要分支： master/main: 生产环境代码 develop: 开发主分支 feature/*: 功能开发分支 release/*: 发布准备分支 hotfix/*: 紧急修复分支 GitHub Flow更简化的工作流： 1234main ●────────●────────●────────●───> \ ...
CSS 实用技巧集锦
CSS 看起来简单，但要精通它需要掌握许多技巧。本文收集了实用的 CSS 技巧，帮助你编写更优雅的代码。 居中技巧水平居中123456789101112131415/* 行内元素 */.parent { text-align: center;}/* 块级元素 */.child { margin: 0 auto;}/* Flexbox */.parent { display: flex; justify-content: center;} 垂直居中1234567891011121314151617181920212223/* Flexbox - 最推荐 */.parent { display: flex; align-items: center;}/* Grid */.parent { display: grid; place-items: center;}/* 绝对定位 + transform */.parent { position: relativ...