Yellowwei の 博客

当我们使用 React 编写组件时，组件的重新渲染是一个重要的概念。重新渲染是指 React 组件在特定情况下会重新执行其渲染函数，更新用户界面以反映最新的数据。很多情况下，组件不必要的重新渲染会严重影响性能，所以要充分了解触发组件重新渲染的条件。 Props 变化 在 React 中，组件的 props 是父组件传递给子组件的数据。当这些 props 发生变化时，子组件将重新渲染以反映最新的数据。 123456789101112// 父组件const ParentComponent = () => { const [value, setValue] = useState(0); return <ChildComponent prop={value} />;};// 子组件const ChildComponent = React.memo(({ prop }) => { // prop发生变化时，会触发重新渲染 return <p>{prop}& ...

TCP 的三次握手 TCP 协议位于传输层，作用是提供可靠的字节流服务，为了准确无误地将数据送达目的地，TCP 协议采纳三次握手策略。 三次握手原理 第 1 次握手：客户端发送一个带有 SYN（synchronize）标志的数据包给服务端；第 2 次握手：服务端接收成功后，回传一个带有 SYN/ACK 标志的数据包传递确认信息，表示我收到了；第 3 次握手：客户端再回传一个带有 ACK 标志的数据包，表示我知道了，握手结束。其中：SYN 标志位数置 1，表示建立 TCP 连接；ACK 标志表示验证字段。 三次握手过程详细说明 客户端发送建立 TCP 连接的请求报文，其中报文中包含 seq 序列号，是由发送端随机生成的，并且将报文中的 SYN 字段置为 1，表示需要建立 TCP 连接。（SYN=1，seq=x，x 为随机生成数值） 服务端回复客户端发送的 TCP 连接请求报文，其中包含 seq 序列号，是由回复端随机生成的，并且将 SYN 置为 1，而且会产生 ACK 字段，ACK 字段数值是在客户端发送过来的序列号 seq 的基础上加 1 进行回复 ...

什么是 Framer Motion Framer Motion 是一个用于 React 应用程序的动画库，它提供了一套简单而强大的工具，用于实现在 Web 应用中创建流畅的动画和交互效果。 声明式动画 Framer Motion 支持声明式的动画定义。通过在组件中使用 JSX 语法，你可以轻松地声明需要应用的动画效果，而不必直接操作 DOM 或编写复杂的动画代码。 12345678910import { motion } from "framer-motion";const ExampleComponent = () => { return ( <motion.div animate={{ x: 100, opacity: 0.5 }}> Hello, Framer Motion! </motion.div> );}; Variants 通过 variants 属性，你可以定义一组状态变化，并在动画中切换这些状态。这样可以更灵 ...

什么是 CDN CDN 是内容分发网络的缩写，是一种分布在全球各地的网络服务，旨在通过在网络上分布内容副本，以减少对单个服务器的负载并加速内容的传输。CDN 通过在用户与内容服务器之间插入缓存服务器来加速内容传输。 CDN 有什么优点 CDN 具有以下优点： 减少延迟：CDN 将内容存储在许多节点上，用户可以从最近的节点获取内容，从而减少网络延迟。 提高网站可用性：CDN 通过在多个地点存储内容，可以在一个地点出现问题时，通过其他地点提供内容，提高网站可用性。 提高网站速度：CDN 加速内容加载，提高用户访问网站的速度。 减少带宽：CDN 可以减少主服务器的带宽，从而节省成本。 减少服务器的压力 CDN 的使用场景 CDN 的应用主要是为了提高网站的内容加载速度、改善用户体验和减少服务器的压力。常见的应用场景包括： 静态内容加速：CDN 网络缓存静态资源，比如图片、视频、CSS 和 JavaScript 文件，以加速内容加载速度。 SSG 站点的部署 建立分布式网络，供不同地区访问，加快不同区域用户访问资源速度 CDN 的缺点和局限性 成本：使用 CDN 需要付费 缓存 ...

How does the Internet Work?As a developer, it is important to have a solid understanding of what the internet is and how it works. It is the foundation upon which most modern software applications are built. In order to build effective, secure, and scalable applications and services, you need to have a solid understanding of how the internet works and how to leverage its power and connectivity. In this article we will cover the basics of internet including what it is how it works, some basic con ...

Thoughts and feelings on the morning of November 6th Firstly, it is necessary to acknowledge a fact: one’s own abilities still need to be continuously improved, and the resume still needs to be continuously optimized. Now I need to consider whether to use the techniques I have learned to create a more perfect website or start learning Flutter and Dart now. The mastery of frame-motion is still very poor. Basically, I follow the videos and can’t make a good animation myself. There is still a long ...

Talk about some difficulties I encountered in my study After having a certain understanding of React , Tailwindcss, Next.js and Frame-motion, I completed a website with animation effects according to the video of Youtube, but for me, how to show the technology applied to my resume There is still a certain difficulty. Completed several websites using Next.js, but still not deployed to the pagoda panel, only deployed on the Vercel platform. Research is needed on how to write the project experience ...

My thoughts this morning Brave people enjoy the world first, and all the beauty in the world must belong to brave people first. Brave people dare to face challenges and are not afraid of difficulties. They believe that every setback is an opportunity for growth, and every failure is a step towards success. Brave people understand that life is not waiting for the storm to pass, but learning to dance in the rain. They bravely pursue their dreams without being influenced by others’ judgment and que ...