This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Jon Madison
Posted Sep 20 - Read on Facebook

If anyone cares to know, it may be shared already, but when writing modules I find it best to embed my images as base-64 strings. Granted this will not work for all browsers, but most modern browsers will let you use base-64 images. I've gotten into the habit of using the "html" property of layers heavily. :) I encode my images using this site: https://www.base64-image.de/ (you can use any converter really) then drop them in a json "resource" file, so I can call them as a variable in my <img src>" tags.

It allows my modules to be "self contained", i.e. no passing around a separate "image" dir. Currently file size limit at base64-image.de is 1MB (which usually should be plenty--think of something else if it's pretty large).

I'd think that it may cause issues with FramerJS preloader (i.e. just won't work Because you can't preload by image name), but any other prominent issues? My prototypes are performing just as snappily as anything else so far...

Let me know if you'd like me to elaborate or share an example.

1 Comments

Jordan Robert Dobson

I do the same thing for SVG too along with base64 encoding images...

Read the entire post on Facebook