Huck's dev blog

Single-Sided vs. Dual-Sided Liquidity: A Quick DeFi LP Guide for BeginnersWhen using Uniswap V3 or similar AMMs to provide liquidity, you’ll often hear the terms “single-sided liquidity” and “dual-sided liquidity.” What exactly are they, and when should you use each? Let’s break it down clearly. 1️⃣ What is Dual-Sided Liquidity? Dual-sided liquidity is the most common form of liquidity provision: You deposit two tokens (e.g., ETH-USDC) simultaneously. Within your specified price range,...

Building a Real-Time Chat App with Next.js and Server-Sent EventsThis time we will explore how to build a high-performance real-time chat application using Next.js + Server-Sent Events (SSE) while showcasing key best practices in modern web development, including real-time communication, immutable state management, type safety, and graceful error handling. preview urlhttps://next-56vi69or7-hucks-projects.vercel.app https://chat.huckdev.com/ Tech Stack HighlightsServer-Sent Events (SSE)...

BackgroundCORS (Cross-Origin Resource Sharing) is a security feature implemented in modern web browsers. It restricts web pages from making requests to a domain different from the one that served the original page. This mechanism protects users from malicious scripts attempting to access sensitive information across sites. However, during local development or API testing, CORS can sometimes block legitimate requests. In such cases, it may be helpful to temporarily disable CORS restrictions...

After installing npm, I wanted to install http-server, but I got an error saying: the reason is that node_module directroy is in a protected directory. Apple Support: System Integrity Protection There are three ways to solve this problem: Use sudo to install (not recommended) Turn off SIP (not recommended) Manually change npm’s default directories (suggested) Using sudo to install will override system files. If a package contains malicious code, using sudo grants the code full system...

报告概述1 背景检查 Tapbit 合约页面的性能，寻找是否有可优化的地方浏览器：Mac 上的 Chrome，版本 131.0.6778.205 (Official Build) (arm64)设备：MacBook Air M3 2 当前性能指标使用工具（WebPageTest 和隐身模式下的 LightHouse）获取 Binance、OKX 和 Tapbit 的性能指标 Binance OKX Tapbit 性能评分 91 92 67 SSR 是 是 否 页面地址：https://www.tapbit.com/contract/futures/BTC-SWAP在线结果：https://www.webpagetest.org/result/250103_AiDcE7_FE/ 为什么 SSR（服务器端渲染）的性能评分比 CSR（客户端渲染）更高？答案将在博客结尾解释。 在接下来的部分中，我们将使用本地 LightHouse 数据分析 Tapbit。 首次内容绘制 (FCP) ：（页面上第一个文本或图像被绘制）2.3 秒...

Report Overview1 backgroundcheck the performance of tapbit futures pages ,to see if there is anything can be optmizedbrowser : chrome on mac Version 131.0.6778.205 (Official Build) (arm64)device : macbook Air M3 2 Current performance indicatorsusing the tool（WebPageTest and LightHouse in incognito mode）to get the metrics result of binance ,okx and tapbit binance okx tapbit performance 91 92 67 SSR YES YES NOT url: https://www.tapbit.com/contract/futures/BTC-SWAPonline result...

In a mobile-first world, ensuring fast JavaScript loading is critical for providing a seamless user experience. When using mobile or 4G networks, a 300 KB JavaScript file can theoretically be downloaded within 1 second, assuming a bandwidth of 2 Mbps. Here’s how the calculation works: Bandwidth Conversion:2 Mbps = 2048 Kbps 2Mbps = 2 * 1024 Kbps = 2048 Kbps ≈ 256 KB/sThis means 256 KB/s of data can be downloaded per second. Download Time:300 KB ÷ 256 KB/s ≈...

there are two common use of closure: pass function as parameter,pass function as return value pass function as parameter12345678910function a1(){ let a = 100; return function(){ console.log(a) }}let a = 200;let b = a1()b();// output 100; Explanation:In this example, the function a1 defines a local variable a (with a value of 100) and returns an inner function. The inner function forms a closure over a. When b is executed, it remembers the environment...

there is simple question how can you check if a variable is an Array。the answer is easy 1arr instanceof Array if result is true ,arr is Array .otherwise arr isn’t; so there is another question： what’s principle behind instanceof in Javascript let me explain there’re two classes. People and Student . Student implements People 123456789101112131415161718class People{ constructor(name){ this.name = name } eat(){ console.log(`${this.name}...

Use the == operator only when checking for null or undefined. In all other cases, use === for strict equality.For example: 12if(obj.a == null){} is equivalent to: 12if (obj.a === null || obj.a === undefined) {}