# FeHelper: a Manifest V3 browser toolbox for JSON, encoding and page debugging

> FeHelper packs more than 30 small developer utilities into one Chrome, Edge or Firefox extension, from JSON formatting to screenshot capture. It is convenient, broad, and worth checking against the permissions it asks for.

**zxlie/FeHelper** — 😍FeHelper--Web前端助手（Awesome！Chrome & Firefox & MS-Edge Extension, All in one Toolbox!）

- Repository: https://github.com/zxlie/FeHelper
- Website: https://fehelper.com
- Stars: 5,676 · Forks: 1,302
- Language: JavaScript
- License: MIT
- Published: 2026-09-14 · Updated: 2026-09-14 · Language: en
- Canonical page: https://hysenlabs.com/projects/zxlie-fehelper

## What FeHelper actually replaces

Most developers accumulate a handful of browser extensions: one for JSON, one for Base64, one for timestamps, one for screenshots. FeHelper collapses that set into a single Manifest V3 extension that the README describes as a toolbox for developers, testers, operations and efficiency users. The tool matrix covers JSON formatting and diffing, encoding and decoding, timestamp conversion, cron expressions, code beautify and minify, a small Postman-style request tester, WebSocket testing, QR and barcode generation, image to Base64, page screenshot, color picking, UUID and Snowflake ID generation, notes, Markdown conversion and an AI assistant.

The target user is not a library consumer. Nothing here is imported into a build. FeHelper is a UI that lives in the browser toolbar and in page context menus, and its value comes from being already open when you need to inspect a JSON response or decode a JWT. If your work happens in a terminal or a CI job, this is the wrong shape of tool entirely.

## How the extension is put together

The repository keeps the extension source under apps/, with manifest.json at apps/manifest.json declaring Manifest V3. Background logic sits in apps/background/, described in the README as holding the service worker, tool registration, menus, statistics and injection logic. Each utility gets its own directory: apps/json-format/, apps/json-diff/, apps/en-decode/, apps/datetime-calc/, apps/page-monkey/, apps/poster-maker/, apps/chart-maker/, apps/svg-converter/, apps/uuid-gen/ and others. The popup panel lives in apps/popup/ and the settings page plus tool marketplace in apps/options/.

Adding a tool means touching several places at once. The README lists the expected set: apps/<tool-name>/index.html, index.css and index.js, a registration entry in apps/background/tools.js, a documentation file under website/docs/<tool-name>.md, and tests or a manual verification note. That is a real constraint, not a plugin API. There is no dynamic loading of third-party tools from a registry; the marketplace concept is about enabling and disabling what already ships.

Build tooling is gulp-based. gulpfile.js drives a pipeline that includes gulp-babel, gulp-htmlmin, gulp-uglify-es, gulp-uglifycss, gulp-imagemin and gulp-zip. Babel's target has been raised to Chrome 100 according to the compatibility table, so the output assumes a modern Chromium engine.

## Installing FeHelper and formatting your first JSON payload

The simplest route is a store install. The README links the Chrome Web Store, Microsoft Edge Add-ons and Firefox Add-ons listings, all under the same extension ID pkgccpejnmalmdinmhkkfafefagiiiad. For an offline install it points to Chrome-Stats for a CRX or ZIP download that you drag onto the browser extensions page.

To build from source, the README gives this sequence. It clones the repository, installs dependencies, runs the Vitest suite and produces a packaged extension:

```bash
npm install
npm test
npm run build
```

The README states the current test coverage as two test files and 79 tests, so a clean npm test should report that count. After the build, load the unpacked extension in Chrome or Edge by opening chrome://extensions/ or edge://extensions/, enabling developer mode, choosing Load unpacked, and selecting the apps directory in the repository. Note that the target is apps/, not the repository root.

Once loaded, the everyday use is automatic. The JSON beautify tool detects JSON in a page and formats it, with syntax highlighting, collapse and expand, sorting, escape parsing and BigInt-safe handling. You can also open the tool manually from the popup and paste a payload. The JSON diff tool takes two payloads and marks added, removed and changed nodes.

## The permission surface is the price of convenience

FeHelper asks for tabs, scripting, contextMenus, storage, webNavigation and notifications, among others. That is a broad grant. webNavigation plus scripting plus tabs is what lets the extension detect a JSON response, inject into frames for the page-monkey tool, and add context menu entries, but it also means the extension can observe navigation across every site you visit. The README's v2026.04 notes mention security work: replacing an unsafe dynamic execution path, fixing Toast and innerHTML XSS risks, and adding a fileType allowlist to the code beautifier. Those are the right fixes, and their presence also tells you the extension has a history of handling untrusted page content.

A second limitation is architectural. The README documents a service worker sleep handling fix, which is the standard Manifest V3 pain: background state does not persist the way it did under Manifest V2. Tools that depend on long-lived background context need explicit handling, and the release notes suggest this has been an ongoing source of bugs. If you need a debugging tool that keeps a persistent connection open indefinitely, test that specific tool before relying on it.

Finally, the project is a browser extension and nothing else. There is no CLI, no server mode and no library entry point in package.json, whose main field points at index.js but whose scripts are limited to gulp watch, gulp build and the Vitest commands. Automation is out of scope.

## FeHelper versus DevTools and single-purpose extensions

The closest alternative in daily practice is the browser's own DevTools. Chrome DevTools already formats JSON responses in the Network panel, decodes JWTs in the Application panel, and captures screenshots through the command menu. The difference in approach is that DevTools is passive inspection of what the browser already loaded, while FeHelper is an active workbench: you paste a payload, paste a second one to diff it, generate a QR code, or convert a spreadsheet to JSON. FeHelper also works on pages you cannot easily open DevTools against, such as a JSON endpoint you want to keep formatted while you read it.

Against single-purpose extensions, the trade-off is the reverse. A JSON-only extension asks for fewer permissions and does one thing with less surface area. FeHelper wins on not having to manage ten installs and on consistent UI across tools; it loses on permission minimization and on the blast radius if one tool has a flaw. The v2026.04 security entries are exactly the kind of issue that a narrower extension would not have had to fix.

## Maintenance, licensing and upgrade cost

The repository is not archived and the last push was on 2026-09-03, which is recent enough that the project is being worked on. The README claims continuous maintenance since 2012. There are no retrieved release entries, so versioning appears to be driven by the v2026.04 style markers in the README rather than by tagged GitHub releases.

The licence is MIT, declared both in the repository and in package.json. MIT permits commercial use, modification and redistribution provided the copyright notice and permission notice are retained. If you fork FeHelper and ship it internally, keep the LICENSE file. This is a statement of what the licence text says, not legal advice; consult your own counsel for anything beyond that.

Upgrade cost is low for store installs, since the browser handles it. For source builds, the moving parts are the gulp toolchain, Babel and ESLint versions, and the dependency overrides for fast-xml-parser and postcss. The devDependencies pin eslint at ^10.2.0 and vitest at ^4.1.4, both major versions that change behaviour between releases, so a fork that lags will need work when it catches up. The README also suggests running npx eslint apps/ to check code style, which is a reasonable gate before committing a new tool.

## Conclusion

Adopt FeHelper if you want one extension for JSON formatting, encoding, timestamps and page debugging instead of a dozen single-purpose add-ons, and if you are comfortable granting tabs, scripting, webNavigation and contextMenus permissions. Skip it if you need a tool that runs without broad host access, or if your workflow depends on a headless or scriptable pipeline, since FeHelper is a browser UI. Before installing, check the manifest permissions against your threat model, confirm the version you get from the store matches the repository, and run npm test after a source build to see the 79 tests pass.

## FAQ

### How do I install FeHelper in Chrome?

Install it from the Chrome Web Store using the extension ID pkgccpejnmalmdinmhkkfafefagiiiad, or build from source and load the apps directory as an unpacked extension with developer mode enabled.

### Can I use FeHelper offline?

Yes. The README describes an offline install path: download a CRX or ZIP from Chrome-Stats and drag it onto the browser extensions page. The extension itself runs locally in the browser.

### Does FeHelper format JSON automatically?

The JSON beautify tool detects JSON on a page and formats it, with syntax highlighting, collapsing, sorting, escape parsing and BigInt-safe handling. You can also paste a payload manually.

## Sources

- [Issues](https://github.com/zxlie/FeHelper/issues)
- [License: MIT](https://github.com/zxlie/FeHelper/blob/master/LICENSE)
- [Project website](https://fehelper.com)
- [README](https://github.com/zxlie/FeHelper/blob/master/README.md)
- [zxlie/FeHelper on GitHub](https://github.com/zxlie/FeHelper)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/zxlie-fehelper