In case anyone's reading comprehension is on par with my former CTO's, let me make this painfully clear: I am not against AI. In fact, I use it so heavily that I can burn through both five-hour limits on my "ChatGPT Pro Max" subscription before 2 p.m. every day with GPT 5.5 medium. I have no doubt that AI has fundamentally changed how we live and work.

We went from Copilot suggesting a few lines of code to accepting Cursor completions by hammering Tab all day. ChatGPT helped me see through the pathetic lies from my previous company. Then Claude Code arrived and turned vibe coding from a joke into something real. Now Codex makes the agentic browser we once wanted to build feel obsolete before we even built it.

When people ask me when I last wrote code without AI, they expect the answer to be a year ago. It was actually the day before yesterday: I manually wrote a few scripts to make some agent workflows more reliable.

AI is developing so quickly that nobody can predict what it will look like in six months. Yet precisely because it is genuinely useful, I have become increasingly frustrated by the culture surrounding it. Too many discussions are no longer asking, "Can this tool solve the problem?" They are asking, "Are you using AI?", "Are you AI-native enough?", "Which company are you backing?", and "Which model do you believe in?" That atmosphere makes me deeply uncomfortable.

Actually, I've always been somewhat reluctant to tackle this topic because the problem is both too fundamental and too broad. I've never been confident about covering this topic well. However, due to some well-known circumstances, I feel I should at least share some of my views and insights from discussions with friends.

Whether frontend or backend, environment variables are a very important concept that can provide context to your programs, such as whether you're in a development or production mode, whether your development environment is local or remote, or what backend URL you're deploying to, some SaaS keys, these are all problems that environment variables can help solve. The reason this topic is difficult to discuss is that different projects may have different best practices, or there might not even exist a so-called "the best practice". I've personally witnessed two Senior Frontend Developers arguing over this issue. Moreover, you must deeply understand a project to know what constitutes an appropriate practice.

As some of my Twitter followers may know, I recently experienced some mental health challenges due to various factors, one of which was my experience with Flutter Web. This might surprise some of my friends, given that I'm known as a Flutter enthusiast.

To be honest, I remain a passionate advocate for Flutter's mobile development capabilities. However, I cannot endorse Flutter Web in any capacity, and I will explain my reasoning throughout this article.

Responsive design is always a nightmare for many frontend developers, particularly when developing applications without careful planning and design consideration. Poor responsive design choices can exponentially increase the complexity of debugging and testing processes.

Flutter was developed to handle cross-platform solution in the first day. It effectively addresses the challenges of building applications for multiple platforms whilst maintaining a single codebase. If you are developing mobile app in a startup company or you are implementing some performance sensitive requirement, Flutter can provide much better experience than React Native. It is a very good idea to render the UI with its own way to tackle with the fragmentation problem of Android devices. I can continually bragging Flutter for saving my life in development, until I was asked to develop a Flutter Web application.

In this article, I will describe some of my understanding on responsive design with MediaQuery in Flutter, focusing on practical approaches and common pitfalls to avoid.

When I was young, I was thrilled to discover I could cancel HTTP requests using cancelToken. However, it took me a month to realize that this didn't actually help reduce server load. These days, developers are quite enthusiastic about AbortController and AbortSignal. Some influential developers discovered that AbortController could be used not just for cancelling fetch requests, but for nearly any event. Soon after, social media became filled with articles about AbortController - to the point where not writing about it seemed to suggest you weren't a proper frontend developer.

I agreed that these features are great and fun, but as a developer, we should not only know what is it, but also know how it works.

Let's start from the basic use case: cancel a fetch request.

An article about the inline style is faster than importing stylesheet and inline class was posted a couple of weeks ago. Many front-end developers were surprised about this and suggested that maybe we can compile styling methods like tailwind CSS into inline style in the future. I was also surprised that frameworks are so popular that people forgot the history of styling websites and how the browser renders the website.

Recently, I was tasked with implementing a new toast that remains fixed at the top of the screen using Flutter's Snack Bar. Initially, I assumed it would be a straightforward process – a matter of calling showSnackBar and configuring the behavior to floating as floating, adjusting the margin to ensure it floats at the screen's top.

As we all know, JavaScript is a beautiful, elegant, and well-designed language. Brendan Eich spent much of his life designing it. Thanks to that, we have such an intuitive language:

NaN !== NaN // true
0.1 + 0.2 // 0.30000000000000004
1 < 2 < 3 // true
3 > 2 > 1 // false 
[] + [] // ""
{} + {} // "[object Object][object Object]"
[] + {} // "[object Object]"
{} + [] // 0

We had a knowledge-sharing slack-off session today, and someone shared a question about the beauty of the language's syntax. It reminded me of my previous job in China. Almost all Chinese companies like using these elegant syntax and principles as interview questions. When I think about the most memorable question I prepared, it has to be this one:

What is the result of Math.max() < Math.min()? why?

Well. it's been a while since I started to use Flutter to develop a commercial App. There are some good practices that help me to deliver high-quality code, reduce the times to refactoring for the performance and prevent OT.

When I first time get in touch with Flutter, it was still a baby project in early 2018. Nowadays, it became even more popular than React Native -- My ex-open-source-area in the past. My current company decides to develop an App with Flutter and as the weakest Penguin in the company, I was forced to join this project.

Flutter became stabler and more functional, but it still has some bugs they have never fixed, and some problems they should handle many years ago, one problem is that they should shake the unused images during the building. It is a big problem that there is no simple way to delete it to reduce the built bundle size. It is hard to find a library/script to delete them, so why not just write it by myself?

TLDR: https://pub.dev/packages/delete_unused_image

With the size growing of the project, an increasing number of logs are written. It is tough to find out helpful detail within hundreds of irrelative logs. Although JavaScript is awkward in many places, it has very powerful tools and ecosystems to debug when it is running on the browser.

Due to the high amount of wordle spam from my friend, I need some tools to reduce their interest of play Wordle. During these months, I developed a website to provide hints of possible worlds and continue to finetune the algorithm. Then, the limitation of the website is found, so I turn to build a browser extension.

In a previous interview, a debug question causes me to deep consideration. What is the GC strategy of JavaScript when we are using setTimeout and setInterval? What happen if we did not clear the timer before releasing the timer of setTimeout?

Lazy loading is a useful technique that can delay loading non-essential content in an application until it is needed. It can reduce the bundle size and increase the loading performance. However, there are many implications and solutions of that in history.

When we are completing the question on leetcode or developing a complicated project, iteration is a useful syntax to traverse complex data structures.

The Array is a common data structure in computer science, the majority of languages provide while and for-loop to iterate the array. Moreover, High-level programming languages always provide some APIs to manipulate arrays.

JavaScript offers tons of methods to control, but querying methods were not provided until ES5. The APIs from ES5 decrease the codes and rapidly increase the readability.