<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[TT_BC的博客]]></title><description><![CDATA[]]></description><link>https://blog.csdn.net/TT_BC</link><language>zh-cn</language><generator>https://blog.csdn.net/</generator><copyright><![CDATA[Copyright &copy; TT_BC]]></copyright><item><title><![CDATA[前端打包性能优化全攻略]]></title><link>https://blog.csdn.net/TT_BC/article/details/156195151</link><guid>https://blog.csdn.net/TT_BC/article/details/156195151</guid><author>TT_BC</author><pubDate>Tue, 23 Dec 2025 14:00:05 +0800</pubDate><description><![CDATA[前端性能优化技术方案 构建优化：采用Vite/esbuild提升打包速度，配置多线程编译和缓存机制减少重复工作。 体积优化：通过TreeShaking、按需加载、图片压缩和代码分割降低包体积，使用gzip/brotli压缩传输内容。 缓存策略：添加contenthash文件名和合理设置HTTP缓存头，最大化利用浏览器缓存。 版本更新：建立版本检测机制，通过ServiceWorker实现平滑更新，提供优雅降级方案确保兼容性。 部署运维：建议启用HTTP/2和CDN加速，实施灰度发布并建立监控回滚机制保障稳定性]]></description><category></category></item><item><title><![CDATA[前端框架性能优化全攻略]]></title><link>https://blog.csdn.net/TT_BC/article/details/156195045</link><guid>https://blog.csdn.net/TT_BC/article/details/156195045</guid><author>TT_BC</author><pubDate>Tue, 23 Dec 2025 13:55:54 +0800</pubDate><description><![CDATA[本文系统介绍了前端框架的优化技术体系。从技术栈选择（React/Vue/Angular）到项目结构设计，详细阐述了代码质量分析（ESLint/SonarQube）、构建优化（Webpack缓存/代码分割）、接口管理（axios/SWR缓存）等核心环节。重点讲解了首屏加载优化策略，包括路由懒加载、关键CSS内联和图片懒加载实现。同时提出建立性能监控体系（Lighthouse/RUM）和采用进阶优化技术（ServiceWorker/WebWorker/WASM）。强调性能优化应形成闭环流程，结合业务场景持续迭代]]></description><category></category></item><item><title><![CDATA[前端框架师进阶指南：30天精通核心架构]]></title><link>https://blog.csdn.net/TT_BC/article/details/156153675</link><guid>https://blog.csdn.net/TT_BC/article/details/156153675</guid><author>TT_BC</author><pubDate>Mon, 22 Dec 2025 16:00:07 +0800</pubDate><description><![CDATA[《中高级前端工程师进阶框架师技术指南》摘要：本文系统阐述了从前端工程师成长为框架师的技术路径，涵盖现代主流框架(React/Vue等)的核心原理与实践。重点包括：1)框架深度解析，如响应式系统、组件生命周期；2)性能优化策略，涉及渲染优化、状态管理；3)定制化开发能力，包括插件开发、运行时扩展；4)架构设计规范与TypeScript集成；5)前沿技术如微前端、SSR实践。通过源码分析、优化案例和技术选型方法论，帮助开发者掌握框架设计思维，提升项目架构与性能调优能力，最终构建完整的技术影响力体系。]]></description><category></category></item><item><title><![CDATA[Vue3+TypeScript实现手机扫码功能]]></title><link>https://blog.csdn.net/TT_BC/article/details/156153323</link><guid>https://blog.csdn.net/TT_BC/article/details/156153323</guid><author>TT_BC</author><pubDate>Mon, 22 Dec 2025 15:54:08 +0800</pubDate><description><![CDATA[摘要：本文介绍了使用Vue3和TypeScript实现网页端二维码扫描功能的完整方案。通过vue-qrcode-reader调用摄像头，配合zxing-js解析二维码，详细说明了组件封装、解码工具实现和主页面集成的步骤。重点包括：1)摄像头权限获取处理；2)二维码解码逻辑；3)扫描结果展示。文章还强调了HTTPS环境要求、移动端适配等注意事项，并提出了扫描区域高亮、多码识别等扩展方向。该方案利用Vue3的组合式API和TypeScript类型检查，为Web应用提供了安全高效的二维码扫描解决方案。]]></description><category></category></item><item><title><![CDATA[Vue3+TS+Vite动态路由实战]]></title><link>https://blog.csdn.net/TT_BC/article/details/150760225</link><guid>https://blog.csdn.net/TT_BC/article/details/150760225</guid><author>TT_BC</author><pubDate>Mon, 25 Aug 2025 09:47:59 +0800</pubDate><description><![CDATA[本文介绍了使用Vue3+TypeScript+Vite构建动态路由系统的完整流程。首先通过Vite初始化项目并安装Pinia和VueRouter，然后配置项目目录结构。重点包括：1)使用Pinia管理用户状态和权限信息；2)将路由分为静态路由和动态路由两部分；3)通过路由守卫实现动态路由的按需加载和权限控制；4)提供登录页面和布局组件的实现示例。文中还强调了动态路由刷新处理、权限验证等注意事项，为构建企业级权限管理系统提供了完整解决方案。]]></description><category></category></item><item><title><![CDATA[Vue3+TypeScript项目构建实战指南]]></title><link>https://blog.csdn.net/TT_BC/article/details/148278636</link><guid>https://blog.csdn.net/TT_BC/article/details/148278636</guid><author>TT_BC</author><pubDate>Fri, 30 May 2025 08:45:00 +0800</pubDate><description><![CDATA[本文详细介绍了如何从零开始构建Vue3+TypeScript项目。首先讲解了使用Vue CLI或Vite初始化的步骤，强调Vite的优势。核心内容包括：Vue3模板语法与指令详解（v-bind、v-model等）、Composition API与TypeScript的集成使用、组件通信与Props类型定义。文章提供了Todo应用实战案例，完整实现增删改查功能，并覆盖项目优化方案（Pinia状态管理、ESLint配置）及部署流程（Vercel/Netlify）。特别注重TypeScript类型安全在各环节的应]]></description><category></category></item><item><title><![CDATA[前端面试核心考点全解析]]></title><link>https://blog.csdn.net/TT_BC/article/details/148306893</link><guid>https://blog.csdn.net/TT_BC/article/details/148306893</guid><author>TT_BC</author><pubDate>Thu, 29 May 2025 11:39:20 +0800</pubDate><description><![CDATA[本文总结了前端面试中的核心技术要点，包括HTML5新特性、CSS盒模型、JavaScript闭包与异步编程等基础知识，以及React/Vue框架的核心考点。重点解析了工程化工具Webpack的优化策略，算法与网络相关的防抖节流实现，并提供了实际的代码示例。文章还涵盖前端性能优化、安全防护和工程化实践等综合问题，通过具体案例演示了虚拟列表、状态管理等高级应用场景，为前端开发者提供了全面的面试准备指南。]]></description><category></category></item><item><title><![CDATA[Vue图片懒加载：从原理到实战优化]]></title><link>https://blog.csdn.net/TT_BC/article/details/148278442</link><guid>https://blog.csdn.net/TT_BC/article/details/148278442</guid><author>TT_BC</author><pubDate>Thu, 29 May 2025 08:45:00 +0800</pubDate><description><![CDATA[本文对比Vue2与Vue3项目中图片懒加载的实现方案。Vue2可通过vue-lazyload插件或IntersectionObserver API实现，需配置占位图和错误处理；Vue3推荐使用@vueuse/core的useIntersectionObserver组合式API或v-lazy-image库。重点介绍了各方案的实现步骤、代码示例及优化策略（如预加载、移动端适配）。最后对比了Vue2/Vue3实现差异，强调性能优化要点，并附相关工具推荐。全文约150字，涵盖核心实现方法与优化建议。]]></description><category></category></item><item><title><![CDATA[TypeScript从入门到实战：全面掌握开发技巧]]></title><link>https://blog.csdn.net/TT_BC/article/details/148172834</link><guid>https://blog.csdn.net/TT_BC/article/details/148172834</guid><author>TT_BC</author><pubDate>Wed, 28 May 2025 08:45:00 +0800</pubDate><description><![CDATA[TypeScript作为JavaScript的超集，提供了静态类型检查和面向对象编程的特性，适用于大型项目开发。本文从基础概念入手，介绍了TypeScript的安装、项目初始化、基本语法（如类型注解、接口、类、泛型等）以及高级特性（如类型推断、装饰器、模块化等）。通过实战项目示例，展示了如何使用TypeScript编写React、Node.js、Express和Vue.js应用，并提供了优化与调试技巧。文章还探讨了TypeScript在项目中的常见问题与解决方案，以及最佳实践，如类型定义、代码组织和架构设计]]></description><category></category></item><item><title><![CDATA[Vue插槽：组件灵活分发的秘密武器]]></title><link>https://blog.csdn.net/TT_BC/article/details/148155981</link><guid>https://blog.csdn.net/TT_BC/article/details/148155981</guid><author>TT_BC</author><pubDate>Tue, 27 May 2025 08:45:00 +0800</pubDate><description><![CDATA[Vue插槽是一种用于组件内容分发的机制，允许父组件向子组件传递模板片段，从而增强组件的灵活性和复用性。插槽分为默认插槽、具名插槽和作用域插槽。默认插槽用于简单的内容分发，具名插槽允许定义多个插槽并通过名称区分，作用域插槽则允许子组件向父组件传递数据。Vue2和Vue3中的插槽机制类似，但Vue3在语法上进行了改进，引入了#简写形式，并提升了性能。插槽在构建可复用组件和自定义布局时非常有用，能够显著提升开发效率和代码质量。]]></description><category></category></item><item><title><![CDATA[Vue2与Vue3组件封装全解析]]></title><link>https://blog.csdn.net/TT_BC/article/details/148142455</link><guid>https://blog.csdn.net/TT_BC/article/details/148142455</guid><author>TT_BC</author><pubDate>Mon, 26 May 2025 08:45:00 +0800</pubDate><description><![CDATA[封装组件是Vue.js开发中提升代码复用性和维护性的关键手段。通过将功能模块化，可以减少重复代码，提高开发效率，并便于团队协作和后期维护。设计组件时应遵循单一职责原则，确保每个组件只负责一个功能，并保持接口简洁，避免过度依赖外部状态。Vue2和Vue3在组件封装方面有显著差异，Vue2使用OptionsAPI，而Vue3引入了CompositionAPI，提供了更灵活的逻辑组织和复用方式。Vue3在性能优化和TypeScript支持方面也有显著改进。通过合理的组件设计和封装，可以显著提升代码质量和开发效率，]]></description><category></category></item><item><title><![CDATA[Axios封装指南：提升开发效率与代码质量]]></title><link>https://blog.csdn.net/TT_BC/article/details/148142270</link><guid>https://blog.csdn.net/TT_BC/article/details/148142270</guid><author>TT_BC</author><pubDate>Fri, 23 May 2025 08:45:00 +0800</pubDate><description><![CDATA[Axios是一个基于Promise的HTTP客户端，适用于浏览器和Node.js环境，支持请求和响应拦截、自动转换JSON数据、取消请求等功能。在大型项目中，直接使用Axios可能导致代码重复和维护困难，因此封装Axios成为必要。封装的核心思路包括统一配置、请求拦截、响应拦截和错误处理，通过创建Axios实例并添加拦截器，可以实现请求的统一管理，减少重复代码。封装后的Axios在项目中直接使用，提高了代码的可维护性和开发效率。进阶优化可包括添加请求取消功能、统一处理loading状态和支持多环境配置等。封]]></description><category></category></item><item><title><![CDATA[从零到精通：全面掌握CSS技术指南]]></title><link>https://blog.csdn.net/TT_BC/article/details/148107125</link><guid>https://blog.csdn.net/TT_BC/article/details/148107125</guid><author>TT_BC</author><pubDate>Thu, 22 May 2025 08:45:00 +0800</pubDate><description><![CDATA[本文提供了从初级到精通的CSS学习大纲，涵盖了CSS的基础概念、选择器、盒模型、布局、文本与字体、背景与边框、动画与过渡、响应式设计、高级技巧、性能优化、常见问题与解决方案以及未来趋势。通过详细的代码示例和解释，读者可以系统地掌握CSS的各个方面，包括浮动布局、定位布局、弹性盒子布局、网格布局等。此外，文章还介绍了CSS预处理器、框架、最佳实践和调试技巧，帮助读者在实际项目中应用所学知识。最后，文章总结了CSS的学习路径和资源推荐，强调了持续学习和实践的重要性，并建议参与开源项目和社区交流以提升技能。]]></description><category></category></item><item><title><![CDATA[ReactNative从入门到精通：生命周期与代码实战]]></title><link>https://blog.csdn.net/TT_BC/article/details/148062122</link><guid>https://blog.csdn.net/TT_BC/article/details/148062122</guid><author>TT_BC</author><pubDate>Wed, 21 May 2025 08:45:00 +0800</pubDate><description><![CDATA[ReactNative是Facebook推出的开源框架，允许开发者使用JavaScript和React构建跨平台移动应用，显著提升开发效率。文章从环境搭建开始，介绍了如何安装Node.js、npm和ReactNative CLI，并创建项目。接着，详细讲解了ReactNative的核心组件（如View、Text、Image等）和Flexbox布局，以及如何使用useState管理状态和处理事件。文章还探讨了组件的生命周期，包括挂载、更新和卸载阶段，并介绍了高级特性如ReactNavigation导航和Red]]></description><category></category></item><item><title><![CDATA[从零到精通：Uniapp跨平台开发全攻略]]></title><link>https://blog.csdn.net/TT_BC/article/details/148062067</link><guid>https://blog.csdn.net/TT_BC/article/details/148062067</guid><author>TT_BC</author><pubDate>Tue, 20 May 2025 09:30:00 +0800</pubDate><description><![CDATA[Uniapp 的生命周期与 Vue.js 的生命周期类似，但在此基础上增加了一些特定于移动端的生命周期钩子。了解这些生命周期钩子有助于更好地控制应用的运行流程。Uniapp 的生命周期钩子函数为开发者提供了丰富的控制点，能够更好地管理应用的运行流程。通过合理使用页面传参、全局状态管理、跨平台兼容性处理和性能优化技巧，可以显著提升 Uniapp 项目的开发效率和运行性能。]]></description><category></category></item><item><title><![CDATA[深入解析Vuex：状态管理核心与实践]]></title><link>https://blog.csdn.net/TT_BC/article/details/148061850</link><guid>https://blog.csdn.net/TT_BC/article/details/148061850</guid><author>TT_BC</author><pubDate>Tue, 20 May 2025 09:15:00 +0800</pubDate><description><![CDATA[Vuex是Vue.js的官方状态管理库，用于集中管理应用中的所有组件的状态。其核心概念包括State（存储应用的状态数据）、Getters（从State中派生出状态）、Mutations（同步修改State的方法）、Actions（异步操作，提交Mutations）和Modules（将Store分割成模块）。通过Vuex，开发者可以确保状态以一种可预测的方式发生变化，并提高代码的可维护性。本文通过一个简单的计数器示例，展示了如何在Vue应用中使用Vuex进行状态管理，包括创建Store、在组件中访问Stat]]></description><category></category></item><item><title><![CDATA[从初学到精通：Flex与Grid布局全攻略]]></title><link>https://blog.csdn.net/TT_BC/article/details/148064624</link><guid>https://blog.csdn.net/TT_BC/article/details/148064624</guid><author>TT_BC</author><pubDate>Mon, 19 May 2025 15:32:33 +0800</pubDate><description><![CDATA[文章系统地介绍了CSS中的Flex布局和Grid布局，从基础概念到进阶应用，涵盖了两种布局的核心属性和使用方法。Flex布局适合一维排列，通过display:flex启用，支持灵活调整子元素的大小和对齐方式；Grid布局则适合二维布局，通过display:grid启用，支持复杂的行列排列。文章还展示了如何结合使用这两种布局，并通过实战案例演示了如何构建完整的网页布局。最后，总结了Flex布局和Grid布局的适用场景和优势，强调了掌握这两种布局对提升前端开发效率的重要性。]]></description><category></category></item><item><title><![CDATA[VueRouter全解析：从入门到精通]]></title><link>https://blog.csdn.net/TT_BC/article/details/148060255</link><guid>https://blog.csdn.net/TT_BC/article/details/148060255</guid><author>TT_BC</author><pubDate>Mon, 19 May 2025 11:54:18 +0800</pubDate><description><![CDATA[Vue Router 的最佳使用场景路由设计的最佳实践未来 Vue Router 的发展趋势与展望。]]></description><category></category></item><item><title><![CDATA[深入解析Vue2生命周期钩子]]></title><link>https://blog.csdn.net/TT_BC/article/details/148057399</link><guid>https://blog.csdn.net/TT_BC/article/details/148057399</guid><author>TT_BC</author><pubDate>Mon, 19 May 2025 10:38:03 +0800</pubDate><description><![CDATA[Vue2的生命周期钩子是Vue实例在不同阶段自动调用的函数，帮助开发者在组件的创建、更新、销毁等关键阶段进行控制。主要生命周期钩子包括：beforeCreate（实例初始化后，数据观测和事件配置前）、created（实例创建完成，数据观测和事件配置完成）、beforeMount（挂载开始前，模板编译完成）、mounted（实例挂载到DOM后）、beforeUpdate（数据更新时，DOM重新渲染前）、updated（数据更新后，DOM重新渲染完成）、beforeDestroy（实例销毁前）、destroye]]></description><category></category></item><item><title><![CDATA[前端javascript数组方法]]></title><link>https://blog.csdn.net/TT_BC/article/details/148056528</link><guid>https://blog.csdn.net/TT_BC/article/details/148056528</guid><author>TT_BC</author><pubDate>Mon, 19 May 2025 10:02:34 +0800</pubDate><description><![CDATA[数组是前端开发中不可或缺的数据结构，用于存储和操作有序数据。本文介绍了数组的基本概念、创建方法（字面量和Array构造函数）以及常用操作，包括添加/删除元素（push、pop等）、遍历（forEach、map等）、查找与判断（indexOf、includes等）、排序与反转（sort、reverse）、拼接与分割（concat、slice等）。此外，还探讨了数组的高级操作（扁平化、拷贝、迭代器等）、性能优化技巧（避免频繁操作长度、使用Set/Map优化）、常见问题（去重、浅拷贝与深拷贝、稀疏数组）以及实际应]]></description><category></category></item></channel></rss>