Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.The docs / definition for hook_rrssb_buttons implies that the SVG should be embedded directly in the module file (inline in the associative array), rather than loaded from a separate file. Unfortunately, this has lead some developers to assume that this is good style -- embedding large chunks of SVG in the PHP file, which just makes it more difficult to update the SVG when it needs to be customized.
#2490828: Reduce page size and improve caching requested that we not embed SVGs in the output HTML, but rather to reference external SVG resources. My request is different -- I'd like some guidance from the module developers to indicate that the SVG doesn't have to be embedded into the PHP code. It's fine to use something like file_get_contents() to get the code to place in the hook.
Ideally, I think that it would be great if the hook definition worked more like drupal_add_js() where you have the option of embedding the SVG in what gets passed back OR you can provide a filename that the module will load.
Comments
Comment #2
GuyPaddock CreditAttribution: GuyPaddock at RedBottle Design, LLC for House at Work commentedComment #3
GuyPaddock CreditAttribution: GuyPaddock at RedBottle Design, LLC for House at Work commentedComment #4
AdamPS CreditAttribution: AdamPS commentedThanks for raising. I am interested in feedback/discussion.
I think there are two distinct questions. I think they can be considered separately because the RRSSB module code can convert between 1) and 2). Please can you have a think about this separation, and let me know which part you are mostly concerned with?
1) How should the website owner/admin specify custom icons. In the stable version it is only possible by modifying the module code. In the dev, there is a hook. Even better would be to allow it through the UI.
Yes if you want to call file_get_contents in the hook that seems fine to me. The results are cached so it would be efficient. Of course if you update the file, don't forget to clear the cache.
2) How should the server deliver icons to the browser/user - which impacts on performance/efficiency for the user. Stable and dev use inline SVG. As the linked issue notes, this increases page size and is less good for caching.
My current idea is to use background-images defined in an auto-generated CSS file. This means no extra files, efficient caching, minimal download size and cross-browser compatibility. It doesn't support further conditional styling of the icons in CSS (which is available now, although probably not commonly used) - and so doesn't support the "micro" icons where the background and foreground colors flip. To my mind such icons are too small for usability, but I guess opinions may vary. I have working code for this, but didn't quite find time to tidy up and check in to dev.
There is a partially complete dev V2 of the rrssb library that has js to background load and inject from an external SVG file per icon. This brings the overhead of fetching multiple separate files, and larger css/js files. It will be slower in the browser, although with a modern PC and fast connection, probably can't notice. NB the library V2 is optimised for manual integration into a page, but seems less optimised for integration into a CMS.
My idea number two is to use a single external SVG (cam be auto-generated again) with all the configured icons. This one is potentially trickier for browser compatibility.
Let me know any thoughts you have.
Comment #5
AdamPS CreditAttribution: AdamPS commentedI've fixed this as follows: