Welcome to agoda-devfeedback, the JavaScript/TypeScript package that's about to make your builds faster than a caffeinated squirrel on a sugar rush! We're here to collect metrics that relate to developers' experience, because who doesn't love a good statistic about how long they've been waiting for their build to finish?
This package supports collecting the build time (compilation time) of projects using Webpack (4.x or 5.x) or Vite (4.x). It's like a stopwatch for your builds, but cooler.
You will need to consume the data the data is sent to the following default endpoints and you can use teh Env Var to override this.
Bundler | Default | Environment Variable Override | Post Data Example |
---|---|---|---|
WebPack | "http://compilation-metrics/webpack" | WEBPACK_ENDPOINT | click here |
Vite | "http://compilation-metrics/vite" | VITE_ENDPOINT | click here |
First, let's get this party started. Install the package:
npm install --save-dev agoda-devfeedback
or if you're yarn-clined:
yarn add --dev agoda-devfeedback
Pro tip: When an error happens, the package will write the error message to devfeedback.log
in your current working directory. You might want to add this to .gitignore
, unless you want your repo to know about all your build failures. We won't judge.
If you're using Webpack, sprinkle this magic into your webpack.config.js
:
const { WebpackBuildStatsPlugin } = require('agoda-devfeedback');
module.exports = {
// ... your other awesome config stuff ...
plugins: [
// ... your other cool plugins ...
new WebpackBuildStatsPlugin(),
],
};
If Vite is your jam, add this to your vite.config.js
:
import { viteBuildStatsPlugin } from 'agoda-devfeedback';
export default defineConfig({
// ... your brilliant config options ...
plugins: [
// ... your other fantastic plugins ...
viteBuildStatsPlugin(),
],
});
Both Webpack and Vite plugins will send not just build data, but also the command you used to run the build (like yarn dev
or yarn build
) as the build identifier. It's like a name tag for your builds!
But wait, there's more! If you want to define your own identifier (because you're a rebel like that), you can pass it as a parameter:
new WebpackBuildStatsPlugin('production-build-deluxe');
or for Vite:
viteBuildStatsPlugin('vite-build-extraordinaire');
Wait, there's even more! If you are limiting the bootstrap chunk size of your js bundle (see anti-chonk), then you can pass that limit here as well. This will help you track how this limit has changed on your project.
viteBuildStatsPlugin('vite-build-extraordinaire', 1000); // 1 mega byte
What is the F5 Experience? have a read here
Remember, we're all about that F5 Experience here at agoda-devfeedback. Our goal is to make your development process smoother than a JavaScript promise chain. Here's what that means for you:
- Setup Should Be a Breeze: You should be able to install this package and get metrics faster than you can say "npm install".
- Fast Feedback Loop: We want your builds to be so fast, you'll forget what you were working on by the time they finish. (Okay, maybe not that fast, but you get the idea.)
We welcome contributions! Whether you're fixing bugs, improving documentation, or adding support for the next big JavaScript build tool, we appreciate your help in making agoda-devfeedback even better. Check out our Contributing Guide for more details on how to get started.
Remember, in the world of agoda-devfeedback, there are no stupid questions, only builds that are taking too long!
Remember, in JavaScript development, there are only two types of projects: those that are measuring their build times, and those that are still waiting for their builds to finish. With agoda-devfeedback, you'll always know exactly how long you're waiting. (Spoiler alert: with our help, it won't be long!)
Happy coding, and may your builds be ever faster! 🚀