DEV Community: Hexloom Labs

Is one client most of your income? Two SUMIFS formulas and a check row

Hexloom Labs — Tue, 06 Oct 2026 00:38:41 +0000

Your total income says how you are doing. Income per client says how fragile that is. If you freelance, two spreadsheet formulas and one check row show both, and they work the same in Excel and Google Sheets.

The data

One row per payment, with a Type column ("Income" or "Expense"), a Client column and an Amount column. Here is a small example, with Type in column B, Client in E and Amount in F on a sheet called Transactions:

Type	Client	Amount
Income	Northwind	4200
Income	Northwind	1800
Income	Fabrikam	900
Income	Contoso	1300
Expense	(blank)	40
Income	Northwind Cafe	600
Income	Fabrikam	700

Total income is 9,500. Keep that number in mind.

Step 1: income per client

On a second sheet, list the client names in column A from row 2 down. In B2:

=SUMIFS(Transactions!$F:$F, Transactions!$B:$B, "Income", Transactions!$E:$E, $A2)

Copy it down. To limit it to one year, add two more conditions on the date column.

Step 2: share of total

In C2:

=IF(SUM($B$2:$B$30)=0, 0, B2/SUM($B$2:$B$30))

Format the column as a percentage. The IF stops a divide-by-zero error before you have logged any income. Sort the table by income, largest first.

Step 3: the check row

This is the part people skip. Put this in E2:

=SUMIFS(Transactions!$F:$F, Transactions!$B:$B, "Income") - SUM(B2:B30)

It should read 0. I ran the example above with three clients listed (Northwind, Fabrikam, Contoso) and recalculated it in LibreOffice:

Client	Income	Share
Northwind	6,000	67.4%
Fabrikam	1,600	18.0%
Contoso	1,300	14.6%

The check cell showed 600, which is the "Northwind Cafe" row. SUMIFS matches the text exactly, so "Northwind" and "Northwind Cafe" are two different clients, and the second one was never listed.

The check matters for a second reason. The share column divides by the sum of the clients you listed, not by your real total. With the 600 missing, Northwind shows 67.4%, but against the real 9,500 it is 63.2%. A missing client inflates every other share, so fix the check before you trust the percentages.

Keeping it at zero

Add a new client to the list on the same day you log their first payment.
Use a dropdown (data validation) on the Client column instead of typing names freehand. "northwind cafe" and "Northwind Cafe" then cannot drift apart.
If the check is not zero, filter the Transactions sheet by Income and look for names that are not on your summary list.

Reading the result

There is no universal safe percentage. The point is that you can now see your own number and decide whether you are comfortable with it. One client with a large share means a single late payment or lost contract hurts a lot. Many small clients usually means more admin per dollar, which you can compare against how many invoices each one takes. Run the same formula for each quarter side by side and a shrinking client shows up.

This is general spreadsheet technique, not financial or tax advice. The full walkthrough, with the other tracker formulas, is here: https://sheets.hexloomlabs.com/articles/track-freelance-income-by-client-spreadsheet

Resize before you compress: a four-step routine for lighter web images

Hexloom Labs — Mon, 05 Oct 2026 18:39:07 +0000

Images are usually the heaviest files a page loads, and a heavy page feels slow, especially on a phone. The most common cause is not a missing compression setting. It is a 4000 px phone photo sitting in an 800 px column. Here is the order I work in, and the one function that does the fitting.

1. Size the image to where it appears

Find the widest the image is ever displayed: an 800 px article column, a full-width banner. Scale the longest side down to about that width, or up to double it if you want crisp results on high-density screens. Keep the proportions and never enlarge.

Dropping pixels nobody will see is the biggest saving available. A phone photo that is 4000 px wide and shown in an 800 px column can go to 1600 px and still look sharp on a high-density screen, carrying far fewer pixels than the original. If you are unsure how wide a slot really is, check the layout in your browser's inspector.

2. Then set the quality

For JPG and WebP, start at 75% and compare the before and after sizes. Most photos look nearly the same at 70 to 80% as at 100%, at a fraction of the size. Lower it a notch at a time, and always re-encode from the original file, so repeated tries do not stack up quality loss.

PNG ignores a quality setting because it is lossless. For a PNG, resizing is the only lever. A photo saved as PNG is usually far bigger than the same photo as JPG, so convert photos; keep PNG for screenshots, text and logos where sharp edges and transparency matter.

3. Fit a size limit

Forms and portals love a hard limit ("under 100 KB"). There is no magic setting, so search for it: try qualities from high to low and keep the first result that fits, and if even the lowest quality is too big, shrink the pixels and try again.

async function fitToBytes(file, maxBytes, type = "image/jpeg") {
  const bitmap = await createImageBitmap(file);
  let scale = 1;
  while (scale > 0.1) {
    const w = Math.round(bitmap.width * scale);
    const h = Math.round(bitmap.height * scale);
    const canvas = new OffscreenCanvas(w, h);
    canvas.getContext("2d").drawImage(bitmap, 0, 0, w, h);
    for (let q = 8; q >= 1; q--) {
      const blob = await canvas.convertToBlob({ type, quality: q / 10 });
      if (blob.size <= maxBytes) return blob;
    }
    scale *= 0.8;
  }
  return null; // could not fit, say so instead of returning a postage stamp
}

It always starts from the original bitmap, so nothing compounds. Two honest limits: a JPG has no transparency, so transparent areas of a PNG turn black or white depending on how you paint the canvas, and very detailed photos (foliage, crowds) need more shrinking than simple ones.

4. Finish in the page

<img src="hero-1600.webp" width="1600" height="900" alt="..." />
<img src="below-fold.webp" width="800" height="450" loading="lazy" alt="..." />

Width and height stop the layout jumping while the image loads. loading="lazy" belongs on images below the fold, not on the main image at the top. Use descriptive file names and alt text. Then reload on a phone-sized window; if it still feels heavy, shrink the largest remaining images first.

Which format

For photos, WebP is usually smaller than JPG at similar quality and all current major browsers support it; JPG is the safe fallback. For screenshots, text and logos, PNG keeps edges sharp and handles transparency, and WebP supports transparency too.

I build a small browser tool that follows this routine, so I can do it without installing anything: set a max width, a quality or a target size in KB, and it compresses in the page with nothing uploaded. The routine above is the same one, written out: compress images for your website.

Counting statute days in JavaScript: security deposit deadlines in five US states

Hexloom Labs — Mon, 05 Oct 2026 18:29:43 +0000

Statutes write deadlines as "within N days", and the two things that trip up code are what counts as a day and what happens when the last day lands on a weekend. Security-deposit return rules for US landlords are a clean example, because five states give five different answers to the same question. This is the date math, plus the traps.

The function

Day 1 is the day after the start date. Optionally skip Saturdays and Sundays. Everything else (time zones, DST) goes away if you work in UTC dates.

function addDays(startISO, n, weekdaysOnly) {
  const [y, m, d] = startISO.split("-").map(Number);
  const t = new Date(Date.UTC(y, m - 1, d));
  for (let i = 0; i < n; ) {
    t.setUTCDate(t.getUTCDate() + 1);
    if (!weekdaysOnly || t.getUTCDay() % 6) i++; // % 6 is 0 on Sunday and Saturday
  }
  return t;
}

Parsing "2026-05-29" with new Date(...) directly would be read as UTC midnight and then printed in local time, which can show the previous day in the Americas. Building the date with Date.UTC and formatting with timeZone: "UTC" avoids that.

Five states, same move-out date

Move-out on Friday, May 29, 2026:

State	Rule (as written in the statute)	Deadline
California	itemized statement within 21 calendar days after the tenant has vacated (Civ. Code 1950.5(h)(1))	Friday, June 19, 2026
Texas	refund on or before the 30th day after the tenant surrenders the premises (Prop. Code 92.103(a))	Sunday, June 28, 2026
Florida	15 days to return a deposit with no claim, 30 days to send notice of a claim (Fla. Stat. 83.49(3))	Saturday, June 13 / Sunday, June 28, 2026
Arizona	14 days, excluding Saturdays, Sundays and legal holidays (A.R.S. 33-1321(D))	Thursday, June 18, 2026 (earliest possible, see below)
Michigan	notice of damages within 30 days, suit or refund within 45 (MCL 554.609, 554.613)	Sunday, June 28 / Monday, July 13, 2026

The traps

1. Weekday-only counting is the exception. Only Arizona's text excludes weekends; the other four have no such exclusion. Arizona skips them, so 14 "days" from May 29 is June 18, not June 12. Reusing a calendar-day function for Arizona gives a deadline six days too early; reusing a weekday function for the others gives one far too late.

2. Holidays are not in the math. Arizona also excludes "other legal holidays", but the Act does not list them. A date picker cannot know which ones apply, so the honest output is "the earliest possible deadline": every holiday inside the window pushes the real one a weekday later, and mailing by the computed date is safe either way. Presenting the number as the deadline would be a bug.

3. Weekend deadlines do not roll to Monday. Several of the examples land on a Saturday or Sunday (Texas June 28, Florida June 13 and 28, Michigan June 28). The California, Texas and Florida texts have no rule moving a weekend deadline to the next business day, so the safe UI behaviour is to warn and say "act the business day before", not to silently show Monday. (I treat Michigan the same way, which is the cautious choice, not a claim about its text.)

4. The start date is the hard part. The statutes count from "the tenant has vacated" (California), "surrenders the premises" (Texas), "termination of the rental agreement" (Florida), "termination of the occupancy" (Michigan). Several do not say whether that is lease end, move-out or key return. Arizona's counts from the last of three events (tenancy terminated, possession delivered, tenant demanded the deposit), and the text does not say whether day 1 is the trigger date or the day after. The function above picks "the day after"; it is a labelled assumption in the tool, not a fact from the statute. When a rule is ambiguous, say which reading the code takes.

5. Two clocks from one date. Florida (15 and 30) and Michigan (30 and 45) run two deadlines from the same trigger, so model a list of rules per state rather than one number:

const MI = [
  { label: "Mail the notice of damages", days: 30 },
  { label: "Sue or return the balance", days: 45 },
];
MI.map(r => addDays("2026-05-29", r.days, false).toUTCString());

A quick test

The cheapest check that catches an off-by-one is a hand-computed table. Mine uses three start dates and all five states, compared against dates counted on a calendar:

const assert = require("node:assert");
assert.equal(addDays("2026-05-29", 21, false).toISOString().slice(0, 10), "2026-06-19");
assert.equal(addDays("2026-05-29", 14, true).toISOString().slice(0, 10), "2026-06-18");

If the weekday case matches by hand, the loop and the % 6 trick are right.

If you just want the dates

I put these rules in five free calculators (no sign-up, runs in the browser, each shows its statute citation and the caveats above): https://hexloomlabs.com/guides/tools/

This is date arithmetic on statute text, not legal advice. Confirm the rule and the start date with the current statute or a local attorney before relying on a deadline.

Merge PDFs in the browser with pdf-lib, and what it silently drops

Hexloom Labs — Mon, 05 Oct 2026 18:26:25 +0000

You can merge PDFs entirely in the browser with pdf-lib. No server, no upload, about ten lines. We use exactly this in a small tool, so here is the whole thing, plus the two things it silently drops, which I checked rather than assumed.

The merge

const merged = await PDFLib.PDFDocument.create();

for (const file of files) {                       // File objects from <input type="file" multiple>
  const buf = await file.arrayBuffer();
  const src = await PDFLib.PDFDocument.load(buf);
  const pages = await merged.copyPages(src, src.getPageIndices());
  pages.forEach(p => merged.addPage(p));
}

const bytes = await merged.save();
const url = URL.createObjectURL(new Blob([bytes], { type: "application/pdf" }));
// <a href={url} download="merged.pdf">

Order of the files array is the order of the output. If you let people reorder, reorder that array.

Two practical notes:

Copy the file list to an array before your first await. Array.from(input.files) (or [...dataTransfer.files] in a drop handler) first, then loop: the list from a drop can be empty by the time an awaited call returns.
Wrap the loop in try/catch. PDFDocument.load throws on files that are not valid PDFs and on password-protected ones. A readable message ("make sure these are valid, non-password-protected PDFs") beats a silent failure.

What `copyPages` does not carry over

copyPages copies pages, not the document around them. I built two small test files with pdf-lib, one with a bookmark (an outline entry) and a text form field, and merged them with the code above. Result from reading the merged file back:

	Source	Merged
Pages	2 + 3	5
Outline (bookmarks)	present	absent
Form fields	1	0

So for a quick "stick these scans together" tool this is fine, but if your users merge fillable forms or long reports with a table of contents, say so on the page and tell them to check the result before deleting the originals. Rebuilding an outline by hand is possible with pdf-lib's low-level API, but it is not something copyPages does for you.

I only tested bookmarks and text fields. I did not test attachments, tagged-PDF structure or page labels, so check those yourself if you depend on them.

Why client-side is worth it

The usual objection is "browsers are slow". I have not benchmarked it, but copyPages moves PDF objects rather than re-rendering or re-encoding pages, so image quality is untouched. The limit that matters is the device's memory: the merged document grows with every file you add, so very large batches of scans are where a phone will struggle.

The upside is privacy you can prove. Open the Network tab, run a merge, and you should see no request carrying your file. That check is easy to do on any tool, including ours.

If you want to see this running, the tool built on the code above is here: Merge PDF. It is free for up to 5 files and 20 MB; a paid tier lifts that limit.

What your photos say about you: the metadata fields to check before you share

Hexloom Labs — Mon, 05 Oct 2026 18:22:31 +0000

A phone photo is two things: the picture, and a hidden record of where, when and with what it was taken. The record is called EXIF metadata, and it travels with the file unless something removes it. Here is how to look at it, and which fields to care about first.

How to look, with what you already have

Looking does not change the file.

Windows: right-click the file, choose Properties, open the Details tab.
Mac: open the photo in Preview and choose Tools > Show Location Info. That shows location only.
iPhone: in Photos, tap the photo, then swipe up or tap the Info button. Apple says this shows the date and time, file name, iPhone model, camera settings and a map of where it was taken.

Each built-in viewer chooses what to show, and none of them claims to list every field. If you want the full list for one file, use a tool that reads the file itself.

The fields, ranked by how much they give away

GPS. Latitude and longitude, stored as degrees, minutes and seconds plus N/S and E/W. A pair like 48° 51' 30.2" N, 2° 17' 40.2" E is 48.8584, 2.2945 in decimal form (south and west become negative numbers). GPS.gov says smartphones are typically accurate to within about 4.9 m (16 ft) under open sky, so assume the pair points at the building you were in or a few metres from it. Extra decimal places do not make it more accurate.
Date and time. When the photo was taken, created and modified.
Serial numbers. The camera body serial number and the lens serial number identify a particular device, not just a model.
Owner, artist, copyright and software tags. These can name you or the tools you use.
Embedded thumbnail. A small second copy of the picture inside the file.
XMP and IPTC blocks. Separate metadata that can hold titles, captions and keywords.

Camera make and model matter least on their own. Check GPS first, then the rest.

What removing metadata does not fix

It does not touch what is visible in the picture: a street sign, a house number or a face is still there. And it cannot clean what a website or app stores after you upload it. Removing metadata only helps for the copy you share.

Check the result

Whatever you use to clean a photo, read the file again afterwards and confirm the fields are gone. Do not take the tool's word for it.

We build a small browser tool for this, Photo Scrubber: it lists what a photo holds, cuts the metadata out of JPG, PNG and WebP files without re-saving the picture, and re-reads the clean copy so you can see what is left. It runs in your browser and nothing is uploaded. Our guide walks through the same lookup with sources: how to see what metadata a photo has.

How to check that a PDF tool really doesn't upload your files

Hexloom Labs — Mon, 05 Oct 2026 18:21:21 +0000

Plenty of PDF tools say your files stay on your device. You can check that yourself in a couple of minutes, with the browser you already have and a throwaway test file.

Check 1: watch the Network tab

Open the tool's page. Press F12 (Cmd+Option+I on a Mac) and click the Network tab. Chrome, Edge and Firefox all have one.
Click the clear button (the circle with a line through it) so the list is empty.
Add a test file and run the tool: merge, compress, whatever it does.
Look for requests that sent data out. Uploads show up as POST or PUT requests, often "multipart/form-data". Click one and read Content-Length under Request Headers, or open the Payload tab. A request about as big as your file is an upload. A request of a few hundred bytes (analytics, a licence check) carries no file.

Check 2: go offline halfway

Load the tool's page fully.
In the Network tab, open the throttling menu (it says "No throttling") and choose Offline.
Run the tool on your test file. If you still get your result, the work did not need a server.
If it errors, some tools fetch part of their code the first time you use them. Go back online, run it once with the test file, then go offline and repeat.

What the wording gives away

"Files are deleted after one hour" or "we never keep your files" describe a server that received the file.
An "uploading" progress bar before the work starts.

Both checks show what a tool did in your session, not what it will do next month. For anything sensitive, run them once with a test file before you trust it with the real one.

We build small browser tools. Our Merge PDF tool merges inside the tab. It loads its code from its own site and, when the page loads, makes one small request to check whether you have a Pro subscription, which carries no file data. Its page walks through the same check: merge PDFs without uploading them.