{"id":25079914,"url":"https://github.com/scottgreenhalgh/jimp","last_synced_at":"2026-05-18T00:06:18.342Z","repository":{"id":257850013,"uuid":"872381980","full_name":"ScottGreenhalgh/jimp","owner":"ScottGreenhalgh","description":"Image Editing in Browser","archived":false,"fork":false,"pushed_at":"2024-10-19T20:35:06.000Z","size":32643,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-26T16:46:02.155Z","etag":null,"topics":["image-processing","javascript"],"latest_commit_sha":null,"homepage":"https://jimp-seven.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ScottGreenhalgh.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-10-14T10:43:21.000Z","updated_at":"2024-11-14T15:40:45.000Z","dependencies_parsed_at":"2025-02-07T03:15:42.320Z","dependency_job_id":"6554429a-afeb-4682-8120-600f86f094dc","html_url":"https://github.com/ScottGreenhalgh/jimp","commit_stats":null,"previous_names":["scottgreenhalgh/jimp"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ScottGreenhalgh/jimp","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScottGreenhalgh%2Fjimp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScottGreenhalgh%2Fjimp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScottGreenhalgh%2Fjimp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScottGreenhalgh%2Fjimp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ScottGreenhalgh","download_url":"https://codeload.github.com/ScottGreenhalgh/jimp/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScottGreenhalgh%2Fjimp/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33160168,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-17T22:39:12.733Z","status":"ssl_error","status_checked_at":"2026-05-17T22:39:10.741Z","response_time":107,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["image-processing","javascript"],"created_at":"2025-02-07T03:15:38.759Z","updated_at":"2026-05-18T00:06:13.334Z","avatar_url":"https://github.com/ScottGreenhalgh.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"### Home Page\n\nRead the uploaded image, process it using a web worker, and display it in your Next.js component with the changes. Numerous buttons avaliable for real time reading.\n\n### /Poke Page\n\nRead an uploaded image, use form inputs to select preset assets from /public to apply to the image. The image is proccessed using the base64buffer to bind the added effects to the image.\n\n### Other routes\n\n- (/matt/hosted-inpit) - showcases the features on page load without web workers.\n- (/matt/upload) - showcases image uploads with a blur effect applied by default through the web worker\n- (/scott) - showcases the initial webworker integration with a blur effect on a single image\n- (/scott2) - showcases the web worker with numerous real time buttons appling an effect to a single image.\n\nThe worker is like an extra set of hands for your browser. When you give it an image to work on, it performs operations like blurring, resizing, and more without slowing down your main webpage. It runs in the background, making sure your page stays responsive.\n\n### Base64buffer\n\nimageBuffer is a Buffer. This type represents a sequence of bytes and is commonly used for handling binary data, such as images or files, in Node.js. When you pass this Buffer to the web worker or use it in any image processing operations, it retains its binary format, which Jimp can handle perfectly.\n\nWhen you have some binary data that you want to ship across a network, you generally don't do it by just streaming the bits and bytes over the wire in a raw format. Why? because some media are made for streaming text. You never know -- some protocols may interpret your binary data as control characters (like a modem), or your binary data could be screwed up because the underlying protocol might think that you've entered a special character combination (like how FTP translates line endings).\n\n### Typescript\n\nJimp does have some native Typescript support, however it isn't as good as other node modules. These can therefore be modified manuall through `jimp.d.ts` where the expected types are defined.\n\n### Notable Functions\n\n- .read() - reads the image from URL\n\n- .getBase64() - needed to encode the image when given by the client (via upload) or to the worker.\n\n- .write() writes the changes back to the image\n\n### Image manipulation Functions\n\nSome functions require parameters to opereate, other do not. Here are some of the most notable and how we used them.\n\n- .resize({w:100});\n- .blur(20);\n- .invert();\n- .opacity(0.3);\n- .pixelate(20)\n- .sepia();\n- .posterize(5);\n- .print({font:image8font, x:100, y:200, text:\"omg sloth!\"});\n- .quantize({colors: 2})\n- .quantize({colors: 4})\n- .fisheye();\n- .normalize();\n- .flip({horizontal:true, vertical:true});\n- .crop({h:200, w:200, x:100, y:100});\n- .rotate({deg:130, mode:false});\n- .fade(0.6);\n- .brightness(2);\n\n### Connecting the webworker\n\n```ts\nconst worker = new Worker(\n  new URL(\"@/workers/jimp.worker.ts\", import.meta.url),\n  {\n    type: \"module\",\n  }\n);\n```\n\n### Supported base64params:\n\n```ts\nlet base64param:\n  | \"image/bmp\"\n  | \"image/tiff\"\n  | \"image/x-ms-bmp\"\n  | \"image/gif\"\n  | \"image/jpeg\"\n  | \"image/png\" = \"image/png\";\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscottgreenhalgh%2Fjimp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fscottgreenhalgh%2Fjimp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscottgreenhalgh%2Fjimp/lists"}