The test is what anyone can run, and the anyone is what the claim needs, because the claim is what the test proves, and the proving is what the repetition allows. The test is the network tab. The tab is what the request shows. The showing is the sending. The sending is the tracking.
The fourteen tools were tested one by one, and the one-by-one is the result, because the result is each tool's traffic, and each tool's traffic is zero, and the zero is what the tab's network tab shows, and the showing is the request not there. The zero is confirmed three ways. The first is the network tab: no request on the input, and the input is the data, and the data is what the conversion uses. The second is the conversion itself: the answer is in the tab, and the network did not carry it. The third is the airplane mode. The airplane mode is the network not there, and the not there is where the tool still works, and the working is what the zero proves. The section below is the fourteen in detail, each with the test, the traffic, and the zero, because the zero is the claim, and the claim is what the test makes checkable.
The security angle is the one the tool exists for, and the exists-for is the part the feature list buries, because the feature list is the sales order and the sales order puts the convenience first. The convenience is real, and the real is the part the security section does not deny, but the deny is what the section is for, and the for is the DevTools collection: 14 pure-HTML developer tools: converters, generators, and inspectors. Zero install, zero tracking, works offline.. The threat model below is the specific one, not the generic one, because the generic threat is the one the reader has heard and the specific threat is the one the reader has not, and the not-heard is what the section earns. The controls are the ones the tool provides, and the provides is the part the architecture review asks for.
The Search Bar Is the Interface
The search bar at the top is the interface to the collection, and the interface exists because the failure mode of a tool page is the remembering-the-tool-but-not-the-name moment. The two-word query filters the cards, and the filter is the part that keeps the matching tools visible while the non-matching fade, and the visible is the part that the tab is designed for, because the tab is the working set and the working set is what the search narrows to. The search matches the description as well as the name, and the description match is the part that catches the query that describes the job instead of the tool, because the developer types the job, and the job is what the description says, and the description-says is the match. The search is the reason the fourteen tools are one tab instead of fourteen bookmarks, and the one-tab is the part that the bookmark manager did not solve, because the bookmark is the tool and the search is the job, and the job is what the developer has.
The Generator Family: The Things You Should Never Type by Hand
The generators cover the values that are correct in exactly one way and painful to produce manually. UUIDs for test data and local development. Strong passwords, where the point is the entropy, not the memorability. QR codes for the URL you are about to hand someone at a demo. Placeholder text for the layout that has to exist before the design can be evaluated. URL slugs for the title you are about to publish, with the punctuation stripped and the casing fixed. Each generator is a small answer to a question that comes up dozens of times a year, and the cost of answering it without a tool is low individually and high in aggregate. The collection treats those small costs as the thing to eliminate. The generators are the least dramatic tools in the set and some of the most used, which is the pattern of the whole collection: the quiet tools carry the load, and the dramatic tools are the insurance you hope you never need but are glad is there.
Who It Is For, and Who It Is Not
The collection is for the developer who hits a format problem and wants the answer in five seconds, not a five-minute search. It is for the two-in-the-morning token decode, the conference-room QR code, the config conversion on a flaky connection. It is not for the team that needs shared workspaces, audit logs, and admin controls — that is a different category of product with a different trust model. It is not for the power user who wants a plugin ecosystem or a macro system — the tools are deliberately one-job-each. And it is not a replacement for a real IDE or a real debugger; it is the set of small, standalone answers that sit next to those tools. The right frame is a drawer of hand tools: each one small, each one specific, and the drawer is the point. Knowing who it is not for is as useful as knowing who it is for, because the wrong user does not get a bad experience — they get an experience that is missing the features they came for, and the missing features are the named ones, the deliberate absences. The collection is honest about its edge, and the edge is the design.
The Fourteen Tools, Grouped by Job
The collection is fourteen tools, and the fourteen group into four jobs, and the jobs are the map that makes the collection navigable. The converters are the format collision job: the YAML to JSON, the CSV to JSON, the HTML to text, and the base64 in both directions, and the collision is the moment the data is in one shape and the next step needs another. The generators are the never-type-by-hand job: the UUID, the password, the QR code, the URL slug, the lorem ipsum, and the placeholder, and the never-type is the part that the hand-typing gets wrong, because the hand-typed UUID has the repeated section and the hand-typed password has the memorable pattern. The inspectors are the read-the-artifact job: the cron parser, the JWT decoder, the hash generator, and the text diff, and the artifact is the thing that is structured but not readable at a glance. The four jobs are the collection, and the collection is the tab.
Offline-First as a Feature, Not an Absence
The tools work without a network connection, and that is the most underrated property in the collection. Airplane mode: the converters still convert. A flaky office connection: the hash generator still hashes. A conference hall with no signal: the diff tool still diffs. The practical moments are specific and real — the deploy that is failing on a train, the token that needs decoding in a meeting room where the Wi-Fi is a joke, the config that needs converting while the VPN is down. An online-only tool is a tool that is unavailable exactly when the network is the thing that is broken. Offline-first is not a fallback mode. It is the difference between a tool that is always available and a tool that is available when the internet agrees. The property costs nothing to build — it is a consequence of the pure-HTML design — and it shows up in the moments that matter most, which are the moments when everything else in the stack is unavailable and the one thing you need is the small tool that does not need the network to be the thing you need. The offline tool is the last tool standing, and that is exactly where you want it.
What I Would Add Next, Honestly
Every collection has a backlog, and being honest about it is more useful than pretending the tool is finished. The candidates in order of value: more converter pairs — the remaining config formats are the obvious gaps; a date-time formatter to sit next to the schedule parser; and a language pass, because the site currently ships in one language while the problems it solves are universal. The candidates I am deliberately not doing: accounts, sync, and personalization. Those are the features that would turn a zero-trust tool into a trust decision, and they are the features that would add a server to a serverless site. The backlog is a list of converters and formatters. Everything else is a different product, and a different product is not the point. The honesty is the feature: the roadmap is short enough to read, the non-roadmap is named, and the reason for each no is the same reason the collection exists in the first place — the tool should stay small enough to trust, and every feature that does not serve that constraint is a feature the collection does not have. The absence is the policy.
14 Tools, One Tab, Zero Install
The collection is fourteen developer tools on a single page: a Cron expression parser, a YAML-to-JSON converter, a URL slug generator, an HTML-to-text converter, a QR code generator, an HTML entities encoder and decoder, a UUID generator, a password generator, a Lorem Ipsum generator, a hash generator for the SHA family, a Base64 encoder and decoder, a JWT decoder, a text diff tool, and a CSV-to-JSON converter. All of them are pure HTML and JavaScript. No install, no extension, no account, no build step. You open the page, you pick a tool, you use it, you close the tab. The design constraint that shaped everything: if a tool needs an install, it will not be used in the moment it is needed, and the moment it is needed is the only moment it matters. Fourteen tools, one tab, zero install — and each one does exactly one job, which is the constraint that makes the collection feel like a drawer of hand tools instead of a software suite. The drawer is the point.
The Inspector Family: Reading What You Cannot Parse in Your Head
Inspectors are for the artifacts that are structured but not human-readable at a glance. The Cron expression parser turns a schedule into a sentence and a visualization of when it fires. The JWT decoder splits a token into its header, payload, and signature, and shows you the claims — including the expiration, which is the answer to why is this failing now. The hash generator computes digests for text, which is the verification step after a download. The diff tool highlights the exact lines that differ between two versions of anything. The common thread: the artifact is right there in front of you, but reading it correctly takes a tool. The collection is that tool, for the artifacts every developer meets. The inspectors are the tools that save the most time per use, because the alternative is not a small cost — it is a wrong answer, and the wrong answer in a schedule or a token or a checksum is the kind of error that costs an hour to find. The inspector finds it in five seconds, which is the entire value proposition of the family.
The GitHub Pages Hosting Model
The collection lives on GitHub Pages, and the Pages model is the operational story: the static files in the repository, the commit that is the version, the push that is the deploy, and the deploy that is the commit. There is no server to patch, no dependency to update, no vendor dashboard to check, and the no-three is the part that the operations time goes to zero, because the zero is the part that the tool's maintenance is the code's maintenance, and the code's maintenance is the pull request, and the pull request is the review, and the review is the quality gate. The Pages hosting is also the trust story: the URL is the repository's URL, and the repository is the part that the fork and the read and the audit happen on, and the three are the parts that the SaaS URL does not offer, because the SaaS URL is the vendor's, and the vendor's is the part that the audit does not reach. The Pages model is the cheap model, and the cheap is the part that the small project survives on, and the survives is the collection's whole operational budget.
What the Collection Is Not
The collection is not an account, and the no-account is the part that the onboarding is zero, because the zero is the part that the first use is the use, and the use is the part that the registration does not gate. The collection is not a service, and the no-service is the part that the uptime is the browser's, because the browser's is the part that the user already has, and the already-has is the dependency that is not added. The collection is not a tracker, and the no-tracker is the part that the analytics is the user's own curiosity, because the curiosity is the part that the counter would measure, and the measure is the part that the counter's server would store, and the store is the part that the no-service does not have. The collection is not a framework, and the no-framework is the part that the build step is the read, because the read is the part that the file is. The four no's are the design, and the design is the part that the collection is, and the is is the tab that works in the air.
The Converter Family: When Formats Collide
Half of the collection exists for one specific pain: the moment when the format in front of you is not the format you need. YAML from a config file needs to be JSON for the API. CSV from the spreadsheet needs to be JSON for the script. An encoded blob from an error message needs to be readable. An HTML entities dump from a scraped page needs to be plain text. A chunk of HTML needs to be the text inside it. Each converter is small, instant, and client-side — the data you paste is processed in your browser and never transmitted anywhere. The collection is organized so that when the format collision happens, the tool is one tab away, and the answer to how do I convert this stops being a five-minute search and starts being a five-second paste. The converters are the highest-frequency tools in the collection, and the frequency is the point: the tool you use a hundred times a year is worth more than the tool you use a hundred times in one emergency, even though the emergency feels bigger when it happens.
The takeaway
The audit closes with the residual, and the residual is the part the control does not reach. the DevTools collection covers the threats the sections named: 14 pure-HTML developer tools: converters, generators, and inspectors. Zero install, zero tracking, works offline. The install is Open https://wuchunjie00.github.io/devtools/, the source is https://github.com/wuchunjie00/devtools, and the source is the part the reader audits, because the audits is the trust the security section is building, and the building is the part the claim does not. The residual risk is stated above, and the stated is the part the reader weighs, because the weighs is the decision, and the decision is what the section is for.
Top comments (0)