Skip to content

Commit

Permalink
docs: add v4 announcement and SUPPORT.md (#375)
Browse files Browse the repository at this point in the history
* docs: add v4 announcement doc

* docs: add SUPPORT.md
  • Loading branch information
cchanxzy authored Nov 10, 2024
1 parent e80eddd commit 5559173
Show file tree
Hide file tree
Showing 8 changed files with 206 additions and 1 deletion.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -8,3 +8,4 @@ demo/examples
/playwright-report/
/blob-report/
/playwright/.cache/
.DS_Store
30 changes: 29 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@
- [Reasoning](#reasoning)
- [Issues](#issues)
- [Contributing](#contributing)
- [Support this Project](#support-this-project)
- [v4.0.0-alpha Announcement](#v400-alpha-announcement)

## Features

Expand Down Expand Up @@ -284,4 +286,30 @@ Feel free to raise an issue on Github if you find a bug or have a feature reques

## Contributing

If you want to contribute to this repository, please refer to the [contributing doc](https://github.com/cchanxzy/react-currency-input-field/blob/main/docs/CONTRIBUTING.md).
If you would like to contribute to this repository, please refer to the [contributing doc](https://github.com/cchanxzy/react-currency-input-field/blob/main/docs/CONTRIBUTING.md).

## Support this Project

If you'd like to support this project, please refer to the [support doc](https://github.com/cchanxzy/react-currency-input-field/blob/main/docs/SUPPORT.md).

## v4.0.0-alpha Announcement

I'm excited to announce the release of **[v4.0.0-alpha.1](https://www.npmjs.com/package/react-currency-input-field/v/4.0.0-alpha.1)**.

This marks the beginning of development for version 4.0.0, and the first improvement is a significant reduction in bundle size, going from ~26KB to ~7KB.

For more information, please refer to the [announcement post](https://github.com/cchanxzy/react-currency-input-field/blob/main/docs/v4.0.0-alpha-annoucement.md).

If you would like to try out the alpha version, you can install it using the following command:

```bash
npm install react-currency-input-field@alpha

yarn add react-currency-input-field@alpha

pnpm add react-currency-input-field@alpha
```

Please note that this version is still in development and may contain bugs or incomplete features.

**Use it at your own risk!**
41 changes: 41 additions & 0 deletions docs/SUPPORT.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
# Support React Currency Input Field

## A Personal Note from the Maintainer

Hi, I’m Chun, the sole maintainer of **React Currency Input Field**. I started this project as a junior/mid-level developer, and it’s been an exciting journey to see it grow and be used by so many people.

Over time, as both the project and I have matured, my professional and personal responsibilities have increased. Balancing a full-time development job with maintaining this project has become challenging, especially when it comes to finding both the time and the mental energy.

These days, my schedule rarely allows me to contribute as extensively as I once did. When I do find free time, I’m often drawn to exploring and building new projects — something I’m sure many developers can relate to.

That said, I remain committed to keeping this project available under the MIT license. It’s a utility component that may seem small, but it provides significant functionality, saving countless hours for developers who’d otherwise have to build it from scratch.

## Why Support This Project?

This project sits in what I call **Goldilocks territory** — it’s popular enough to be widely used and relied upon, with an average of **800k downloads per month**, but not quite recognized enough to attract regular contributors or sponsorships.

Despite its popularity, maintaining the project falls solely on my shoulders. I’ve worked hard to ensure it remains **efficient, lightweight, and reliable**, but sustaining this effort alone has its challenges. In nearly **six** years, I’ve received only **one** sponsorship contribution.

Another misconception about open-source work is that, while maintaining this project has significantly improved my skills, it doesn’t always translate into career benefits. Interviewers rarely bring it up, and I still go through the same technical screenings as any other candidate. Open-source work is a labor of love, often undervalued despite its impact.

If this package has saved you or your team time and effort, consider supporting it as a way to show appreciation for the time and dedication that went into its development.

## How You Can Help

### 1. Financial Contributions

Financial support allows me to prioritize maintaining this project despite my limited availability. You can contribute through [GitHub Sponsors](https://github.com/sponsors/cchanxzy).

### 2. Contribute

Help keep the project thriving by contributing code, fixing bugs, or improving documentation.

See the [Contributing Guide](https://github.com/cchanxzy/react-currency-input-field/blob/main/docs/CONTRIBUTING.md) for more information.

### 3. Spread the Word

Share the project with your colleagues or within your community. The more people who use and know about it, the more likely it will attract contributors and support.

## Thank You!

Your support, in any form, means a lot. Whether through sponsorship, contributions, or simply using and sharing the project, I appreciate your help in making **React Currency Input Field** better for the entire community.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/2024-11-10-treemap-after.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/2024-11-10-treemap-before.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
135 changes: 135 additions & 0 deletions docs/v4.0.0-alpha-annoucement.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
# Announcing React Currency Input Field v4.0.0-alpha 🎉

I'm excited to announce the release of **v4.0.0-alpha.1** for [react-currency-input-field](https://www.npmjs.com/package/react-currency-input-field)! This marks the beginning of development for version 4.0.0, and I'd like to share some of the significant updates included in this alpha version.

- [Announcing React Currency Input Field v4.0.0-alpha 🎉](#announcing-react-currency-input-field-v400-alpha-)
- [Why v4?](#why-v4)
- [What's New So Far?](#whats-new-so-far)
- [1. Build Process Overhaul](#1-build-process-overhaul)
- [2. Development Tools Update](#2-development-tools-update)
- [Benefits of the New Build Process](#benefits-of-the-new-build-process)
- [Benchmarks](#benchmarks)
- [Better Treemap visibility](#better-treemap-visibility)
- [Alpha Release: What to Expect](#alpha-release-what-to-expect)
- [When Will v4 Be Stable?](#when-will-v4-be-stable)
- [How to Install](#how-to-install)
- [Feedback Welcome](#feedback-welcome)
- [Support the Project](#support-the-project)

## Why v4?

Version 3.0.0 of this package was released four years ago, marking a significant milestone in its development. Since then, we've seen many minor updates that have maintained the stability and reliability of the package.

This stability has been both a strength and a limitation. On the one hand, users have enjoyed a dependable tool. On the other hand, the landscape of React and JavaScript has evolved during this time, with new patterns, tools, and performance optimizations becoming the norm.

It's time for this package to evolve as well. The goal is to modernize and optimize it to meet the demands of today's development environment, ensuring it remains efficient, lightweight, and aligned with current best practices.

## What's New So Far?

### 1. Build Process Overhaul

- **Switched from Rollup to esbuild**
This component is now built and compiled using esbuild, leading to a much simpler and more efficient build process.

- **Dropped UMD Build**
To reduce complexity, the UMD build is no longer exported. The package now only exports **CJS** and **ESM** builds.

- **Minified Build**
The new build is now minified, resulting in smaller file sizes and faster load times. See the [benchmark](#benchmarks) for comparison.

- **Improved Treeshaking**
The new build supports better treeshaking, allowing unused code to be excluded from your bundles. This results in optimized performance and smaller final builds for your projects.

- **[Enhanced Visibility with Treemaps](#better-treemap-visibility)**
Since the new build is not bundled, you'll now have the ability to analyze the treemap for the package's functions, giving you better insight into what’s included in your bundle.

### 2. Development Tools Update

- **Moved from Yarn to pnpm**
Development dependencies are now managed with pnpm, providing better performance and disk space savings.

## Benefits of the New Build Process

One of the most exciting outcomes of this change is a **dramatic reduction in bundle size**:

- Previous size: **~26KB**
- New size: **~7KB**

That's roughly a **70% reduction**! 🚀

This improvement translates to quicker load times and lower memory usage for your projects.

### Benchmarks

The following benchmarks highlight the reduction in bundle size.

Bundle size comparison between a Vite project and a Next.js project using bundler analyzers:

![Bundle Size Reduction 1](./assets/2024-11-10-compare-stat-size-chart.png)

Comparing the Gzipped sizes:
![Bundle Size Reduction 2](./assets/2024-11-10-compare-Gzipped-size-chart.png)

### Better Treemap visibility

As you can see below, you are now able to analyze the treemap for the package's functions, giving you better insight into what’s included in your bundle.

Before, you could only see the top level package in the treemap:
![Treemap 1 before](./assets/2024-11-10-treemap-before.png)

Now, you can see the individual functions in the treemap:
![Treemap 2](./assets/2024-11-10-treemap-after.png)

## Alpha Release: What to Expect

As this is an alpha version, there might be changes to the package structure and API before the stable release.

I'm taking this opportunity to:

- Review the current API: Does it still make sense? Can it be improved or simplified?
- Gather feedback from the community.
- Ensure the package meets modern best practices.

I want to ensure any necessary breaking changes are made in this release to avoid frequent major version updates, as that’s never fun for anyone.

## When Will v4 Be Stable?

Honestly? **I’m not sure yet**. It will depend entirely on how much time I can spare inbetween work, life and social commitments. Rest assured, I’ll keep you updated as things progress.

## How to Install

If you would like to try out the alpha version, you can install it using the following command:

```bash
npm install react-currency-input-field@alpha

yarn add react-currency-input-field@alpha

pnpm add react-currency-input-field@alpha
```

Please note that this version is still in development and may contain bugs or incomplete features.

**Use it at your own risk!**

## Feedback Welcome

Your input is welcomed. If you encounter any issues or have suggestions, feel free to open an issue on [GitHub](https://github.com/cchanxzy/react-currency-input-field/issues). Let's make this package even better together!

Thank you for your support! 🙌

## Support the Project

If you’ve found **react-currency-input-field** valuable, consider supporting its ongoing development through [GitHub Sponsors](https://github.com/sponsors/cchanxzy).

I started this project in 2017 as a junior-to-mid level developer, and it’s been incredible to see it grow and be used by so many. Over the years, both the project and I have matured, but with increased responsibilities in my professional and personal life, maintaining the same level of commitment has become a challenge.

While the project remains MIT licensed and freely available, your support can help ensure its continued maintenance and improvement. Whether through contributions or sponsorships, your help is greatly appreciated!

Please refer to the [support doc](https://github.com/cchanxzy/react-currency-input-field/blob/main/docs/SUPPORT.md) for more information.

---

**Chun**
_Maintainer_
_Date: 2024-11-10_

0 comments on commit 5559173

Please sign in to comment.