svg-gobbler

Open source browser extension for finding, editing, exporting, optimizing, and managing SVG content.

APACHE-2.0 License

Stars
837
svg-gobbler - v5.12 Latest Release

Published by rossmoody 3 months ago

What's Changed

image

v5.8

  • Added a modal for feedback after a delay of days and usage. The feedback has been amazing. Thanks to all that sent messages.

v5.9

  • Localized the app in English, Spanish, Chinese, French, Russian

v5.10

  • Added a feedback mechanism for uninstalls that sends to a form to request a reason. This has not been so helpful. Most people type 'asdfasdfasdfasdf' into the form because they think it's mandatory to uninstall. 3/10. Would not recommend.

v5.11

  • Switched build command to pnpm
  • Updated the details page SVG preview with zoom, background transparency, and drag
  • View settings now persist between launches
  • Reinstated the actions on the card without the context menu (people weren't finding it and it was heavily requested)

v5.12

  • Emoji picker added for collection icons
  • Keyboard shortcut for back now navigates back
  • Sort by last edited for most recent and least recent
  • Icons now have a concept of a "name" which will set us up to facilitate sprite and font exports
  • Icons can be be exported using their name or a supplied file name prefix
  • Fixes side panel width form collapsing in image export views

Full Changelog: https://github.com/rossmoody/svg-gobbler/compare/v5.7...v5.12

svg-gobbler - v5.7

Published by rossmoody 6 months ago

What's Changed

v5.7

  • Added a review request prompt for users with over 3 collections
  • Fixed filename prefix logic to not be broken if none is supplied
  • Added card canvas color functionality independent of theming
  • Fixed an error in settings page

v5.6

  • File name prefixing for zipped downloaded of any file type
  • Style fixes

v5.5

  • Added reset environment button in dev environment
  • Tooltip for live editing in detail view added
  • Added a Review Modal in sidebar

v5.4

  • Right click tooltip for onboarding context menu functionality
  • Abstracted user context for onboarding logic

v5.3

  • Externalized processing scripts to separate package
  • Setup perfectionist in ESLint and organize all the things
  • Improved logic on sourcing of svgs
  • Fixed base64 parsing error on background image sources
svg-gobbler - v5.2 - Context Menu & Improved Sourcing

Published by rossmoody 11 months ago

What's Changed

  • Context menu added for clicking individual SVG cards with duplicate, delete, and export options
  • Improved background image .svg sourcing
  • Fixed an issue where svg elements with xlink:href weren't being parsed by DomParser
  • Aborting fetch calls in 3 seconds instead of hanging for 10+ seconds
svg-gobbler - Version 5.0 - Codebase rewrite

Published by rossmoody 11 months ago

SVG Gobbler has gone through its 5th complete rewrite. This provides a basis to build on for providing more complex functionality around SVGs with routing.

image

What's Changed

  • Complete codebase rewrite with a new dashboard layout that persists site collections that are sourced for SVGs
  • SVG content is now editable in the detail view. Changes can be saved and kept in perpetuity
  • SVGR export options added for configuring React component transformations
  • Quality of life updates for moving, copying, editing, optimizing, and exporting SVGs across various sites
  • Bulk download options can now be run through SVGO and exported in various file formats as a group
  • Exporting as .webp, .jpeg, .png, and regular .svg

New Contributors

Full Changelog: https://github.com/rossmoody/svg-gobbler/compare/v3.9...v5.0

svg-gobbler - v4.5 - Sticky header, prefers-color-scheme

Published by rossmoody over 1 year ago

  • Defaulting to a user's preferred color scheme when launched
  • The toolbar is sticky to make it easier to switch between light and dark themes when scrolling through icons
svg-gobbler - Version 3.12: SVG Paste, Italian Localization, Onboarding

Published by rossmoody almost 3 years ago

👍 New Functionality

  • Paste SVG code to process
  • Localized to Italian (ty @d3ward)
  • Improved onboarding experience to warn about page refreshes

image

Updates

  • Improved menu behavior
  • Toned back Tab permissions to minimum amount needed
  • Renamed master to main
  • Updated build commands cause I kept forgetting how to build and package the extension
svg-gobbler - Version 3.9: Localization and accessibility updates

Published by rossmoody about 3 years ago

E90HFoTVgAQ8yEU

  • Established the foundation for localization strings. Want to help localize to words other than poop? Snag any language and submit a PR 🤙
  • Accessibility improvements for tabbing focus through Modals
svg-gobbler - Version 3.8: Rename files, Data URI svgs

Published by rossmoody about 3 years ago

Updates

CSS Tricks had some great feedback for the Gobbler so this release is largely addressing some of those suggestions.

image

  • Rename images and svgs before downloading
  • SVGs with white fills will now display with a light grey box behind them in light mode
  • Better communication and UI for exporting and resizing images
  • Successfully scraping data URIs with svgs in them
  • Building and finding sprite svgs much more effectively
  • Refactor to SVG class generation

image

image

svg-gobbler - Version 3.6 - SVGR, Dropzone, and Pagination

Published by rossmoody over 3 years ago

  • Add React Component transformations with SVGR
  • Dropzone support to add your own SVGs (lost on page close for now)
  • Force update revert to prompt page render in certain cases of page refresh
  • Pagination support for pages with lots of SVGs (YouTube has 884!)
  • Empty state handling instead of that pesky alert dialogue
  • SVG Gobbler can now be opened from system and new tab pages instead of appearing disabled
  • Removed activeTab permissions from manifest

test

svg-gobbler - v3.3

Published by rossmoody over 3 years ago

Refactor of the code view to add more functionality

  1. SVGO optimization toggles were implemented
  2. Displaying the SVG byte size depending on the optimization settings
  3. Quick optimization configurations in the code view

image

svg-gobbler - v3.2

Published by rossmoody over 3 years ago

  • Added feedback mechanism from Feedback Fish (awesome app). Please gimme all the feedbacks.

image

  • Extension icon now disables when page isn't valid to be scraped

image

  • Cors restricted SVGs now automatically open SVG Gobbler in a new tab when prompted
  • Large SVG class logic refactor to be more understandable
  • Small design refactor for the menu

image

  • Improvements to parsing and building g elements
  • Implemented a Drawer component for viewing and copying the SVG markup (both original and optimized)

image

svg-gobbler - 3.0

Published by rossmoody over 3 years ago

image

  • Codebase rewrite to Typescript and React
  • Leveraging Chakra UI as a component library
  • Complete UI overhaul
  • Simplified Webpack configuration and version update to 5.0
  • Simplified SVG edge case handling related to cors, sprites, and symbols
  • Support for refreshing the page and not losing SVG content
  • Improved error handling in Chrome extension message passing
  • Download and copy now use the original version by default
  • Optimizing the content before export has been moved to the overflow menu
  • Improved logic for gathering and building sprite instances on the page
  • Improved logic and communication related to sprite masters
  • Bug fixes for a few sites
  • Better error handling
svg-gobbler - v2.5

Published by rossmoody over 3 years ago

Notes

  • We are now gobbling base64 img srcs thanks to @krisu5 #65
  • Added a theme-switcher for viewing those pesky white svgs. thanks to @chrismessina for the awesome suggestion
    image
svg-gobbler - v2.3

Published by rossmoody over 4 years ago

🎉 Features

Screen Shot 2020-07-15 at 12 53 10 PM

Screen Shot 2020-07-15 at 12 53 17 PM

  • SVGs can now be exported as PNG #60

Fixes

  • Added communication to the footer for submitting feedback in various capacities #59
svg-gobbler - v2.2

Published by rossmoody over 4 years ago

Fixes

  • Fix incorrect viewBox width/height parameter order #57 ty @NAjustin
  • General style polish to cards

Improvements

  • SVGO optimization is back! SVGs that are copied or downloaded now receive optimization automatically
  • Just incase SVGO takes too many liberties, there is an avenue to download or copy the original SVG as well
svg-gobbler - v2.1

Published by rossmoody over 4 years ago

🌮 Improvements

Screen Shot 2020-07-11 at 5 18 19 PM

Lots of positive updates in this release. If I'm honest, it was mostly just me being confused about correct Promise implementation.

  • After battling with Promise resolution for three days, turn out text() returns a Promise and I wasn't awaiting it. This tiny bug fix significantly improves card render formatting.
  • Improved error handling within Promise.all filtering. ty @solominh
  • Improved CORS handling for Firefox and Chrome. You can download SVGs after opening in a new tab now as well (before the Extension wouldn't fire at all)
  • Improved communication in the Download all button. It now only downloads available SVG strings instead of zipping up img elements masquerading as SVGs
  • Fixed asynchoronous messaging when trying to send data to a new tab ty @deliaz
  • Style updates to the cards. We gave the grey background behind white SVGs a little padding and lightened it up a bit
  • Improved the error notification on the cards to more accurately say what is happening for Sprites and CORS
  • Sprites now dynamically copy their xlink content so exported sprites are now valid SVGs (though they still reference a single id). Thought it was a pretty crafty hack for not being able to access content in the shadow-dom.

What's next

  • Bringing back SVGO implementation for optimizing SVGs before export or copy
  • Explore SplitChunksPlugin for webpack so the bundle isn't 4mb
svg-gobbler - v2.0!

Published by rossmoody over 4 years ago

Complete codebase rewrite

Under the hood

  • Complete codebase rewrite and simplification
  • Revised webpack to segment and export modules more sensibly. This saved significant bundle size. We we are at around 800kb. Crazy to think the first releases were like 6mb+.
  • Improved class structure of SVG creation. It's easier to read and understand now.
  • Set up a testing index.html site with live-server for local testing applications

On top of the hood

  • SVG Gobbler now opens in a new Tab instead of on top of the content of the current page. This will set it up to be much more modular and thankfully it won't have to compete with the page styling.
  • Improved Sprite handling. Copy and Download should work significantly better
  • Improved size determination. This helps SVGs format more dependably in the cards
svg-gobbler - v1.3.0

Published by rossmoody over 4 years ago

New functionality

  • Isolated SVGs on pages that are opened in a new tab due to CORS can now be copied to clipboard by hitting the SVG Gobbler extension icon.

Fixes

  • Fixed a break in gobbling svgs from image sources. They now fetch and error to the console correctly
  • Fixed some specificity styling with the buttons on certain sites.
  • Removed Feedback mechanism
  • Removed SVGO from the package. It was increasing the package size by 8x and generally causing problems
  • Updated all dependencies
  • Fixed a regression with size estimation based on boundingClientRects
  • No longer rendering percent based sizing in the cards
svg-gobbler - v1.0.16

Published by rossmoody almost 5 years ago

  • Fundamental exports for PNG and JPG formats implemented (ty @jasonrsadler!)
  • Improved SVG size determining logic
  • Download All button added (not optimized on export though cause I can't figure it out, halp!)
  • Fixed issue with overflow on html not being able to scroll on certain sites
  • Removed the viewBox and hidden from view indicators. They were being given too much prominence
svg-gobbler - v1.14

Published by rossmoody about 5 years ago

  • Increased file naming convention. Now grabs the name of the site instead of endless gobble-gobble.svg which even I found annoying
  • Improved CORS alert messaging and styling. It now has it's own icon
Related Projects