学习笔记──React──基本概念
1. JSX描述JSX 是一个 JavaScript 的语法扩展，长得很像 HTML。它被用来描述 UI 的结构，React 元素使用 JSX 来创建。详细解释JSX 看起来像模板语言，但它充分利用了 JavaScript 的能力。每个 J...
学习笔记──React──依赖安装
一、一些必要的依赖# 安装 Babel 和相关插件npm install @babel/core @babel/preset-env @babel/preset-react @babel/preset-typescript babel-loader# 安装 ESLint 和相关插件npm install esli...
学习笔记──React──搭建
方法一：使用 create-react-app 搭建 React 项目1. 确保电脑已经安装 Node.js 和 npm2. 安装 create-react-appcreate-react-app 是一个全局命令行工具，可以帮助你创建一个新的 React 项目。npx...
前端性能优化
一、优化加载速度压缩和合并文件：将多个CSS或JavaScript文件合并成一个文件，减少网络请求次数，使用压缩工具减小文件大小图片优化：使用合适的图片格式、压缩图片大小、懒加载和延迟加载图片...
前端性能优化-CSS部分
加载层面为了避免让用户看到长时间的白屏时间，我们应该尽可能的提高css加载速度，比如可以使用以下几种方法:使用CDN(因为CDN会根据你的网络状况，替你挑选最近的一个具有缓存内容的节点为你提...
前端性能优化-页面渲染流程
一、浏览器渲染流程网页的生成过程，大致可以分成五步。很快： 解析HTML【遇到标签加载图片】 —> 构建DOM树很快： 加载样式 —> 解析样式【遇到背景图片链接不加载...
Taro | 多端统一开发解决方案
Taro是一个多端统一开发框架，可以帮助开发者使用一套代码同时适配多个小程序和Web平台，如微信小程序、支付宝小程序、百度小程序、字节跳动小程序、QQ 小程序、快应用、H5等。一、特点优势多端...
前端性能优化-CSS动画性能
一、浏览器渲染流程网页的生成过程，大致可以分成五步。很快： 解析HTML【遇到标签加载图片】 —> 构建DOM树很快： 加载样式 —> 解析样式【遇到背景图片链接不加载...
前端优化方案
一、无损压缩图片大小，提升页面加载速度使用工具如TinyPNG压缩PNG和JPEG格式的图片，调整图片质量参数以获得最佳压缩效果。使用CSS Sprites将多个小图片合并成一张大图，减少HTTP请求，将多个...
学习笔记──搭建脚手架(一)──系统创建
前言通过借鉴同事的一个脚手架一步步实现如何去做一个脚手架。Node.js：整个脚手架的运行环境。es6：JavaScript的新语法。commander：TJ大神开发的工具，可以自动的解析命令和参数，用于处理用...