{"id":24980018,"url":"https://github.com/javigong/grafiko-image-effects-webpack-js-rust","last_synced_at":"2026-04-02T02:50:30.051Z","repository":{"id":156895974,"uuid":"624545350","full_name":"javigong/grafiko-image-effects-webpack-js-rust","owner":"javigong","description":"Grafiko is a web app image editor implemented with JavaScript, HTML/CSS, Rust, Wasm, and Webpack.","archived":false,"fork":false,"pushed_at":"2023-04-28T16:46:54.000Z","size":856,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-02-04T04:31:20.238Z","etag":null,"topics":["base64","css","html","image-effects","javascript","rust","wasm-bindgen","webassembly","webpack"],"latest_commit_sha":null,"homepage":"https://grafiko-image-effects-webpack-js-rust.vercel.app","language":"HTML","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/javigong.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}},"created_at":"2023-04-06T17:56:49.000Z","updated_at":"2024-04-08T09:08:21.000Z","dependencies_parsed_at":null,"dependency_job_id":"05a49eb1-3229-42c6-995d-68108abc70d8","html_url":"https://github.com/javigong/grafiko-image-effects-webpack-js-rust","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/javigong%2Fgrafiko-image-effects-webpack-js-rust","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/javigong%2Fgrafiko-image-effects-webpack-js-rust/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/javigong%2Fgrafiko-image-effects-webpack-js-rust/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/javigong%2Fgrafiko-image-effects-webpack-js-rust/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/javigong","download_url":"https://codeload.github.com/javigong/grafiko-image-effects-webpack-js-rust/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246168086,"owners_count":20734389,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["base64","css","html","image-effects","javascript","rust","wasm-bindgen","webassembly","webpack"],"created_at":"2025-02-04T04:29:20.299Z","updated_at":"2025-12-30T20:30:08.821Z","avatar_url":"https://github.com/javigong.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Grafiko: Image Effects Web App\n\nGrafiko is an image editor that applies a grayscalling effect to PNG images.\n\nThe grayscalling effect is a CPU intensive task that I implemented with Rust and compiled into WebAssembly. With WebAssembly the browser can access to the CPU to maximize the performance when editing images.\n\n![captures_chrome-capture-2023-3-26](https://user-images.githubusercontent.com/42308135/234749076-9a4c95bd-d711-406f-a2bc-c6148b278cad.png)\n\n\n🔗 [Open live Demo](https://grafiko-image-effects-webpack-js-rust.vercel.app/)\n\n## Tech Stack\n\n- JavaScript\n- HTML/CSS\n- Rust\n- Crate libraries:\n  - wasm-bindgen\n  - base64\n  - image\n- Webpack\n\n## Features\n\n- Image base64 encoding/decoding\n- Image buffering\n- Grayscalling effect\n\n## Screenshot\n\n![captures_chrome-capture-2023-3-26 (1)](https://user-images.githubusercontent.com/42308135/234757268-75910bfd-6093-44e8-86dd-7935597eb24f.png)\n\n## Installation\n\nFirst, clone the project and open it with Visual Studio Code:\n\n```bash\ngit clone https://github.com/javigong/grafiko-image-effects-webpack-js-rust.git\n\ncd grafiko-image-effects-webpack-js-rust\n\ncode .\n```\n\nFinally, install the npm dependencies and run the application:\n\n```bash\nnpm install\n\nnpm run serve\n```\n\nNow the application is running on http://localhost:8080 🚀\n\n## Deployment details\n\nGrafiko Web App deployed using Vercel: \n\n[https://grafiko-image-effects-webpack-js-rust.vercel.app/](https://grafiko-image-effects-webpack-js-rust.vercel.app/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjavigong%2Fgrafiko-image-effects-webpack-js-rust","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjavigong%2Fgrafiko-image-effects-webpack-js-rust","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjavigong%2Fgrafiko-image-effects-webpack-js-rust/lists"}