Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Using SVG as image placeholders

medium.com

Post reply on HN
Print view View original

121–130 of 139 posts

Re: Using SVG as image placeholders

#121

Post by fogleman »

santaclaus wrote: post #86
fogleman wrote: post #13

(Developer of Primitive here.) Love seeing people use my software in different ways! If this looks interesting to you, try it out: https://primitive.lol/ https://github.com/fogleman/primitive Also, I made a Twitter bot that posts samples every 30 minutes based on "interesting" Flickr photos using randomized Primitive settings: https://twitter.com/PrimitivePic

Aren't you the guy who writes all the graphics stuff in Go too? How do you find time to do all this???

What do you do with all of your time? :)

Re: Using SVG as image placeholders

#122

Post by fogleman »

piyush_soni wrote: post #98
fogleman wrote: post #13

(Developer of Primitive here.) Love seeing people use my software in different ways! If this looks interesting to you, try it out: https://primitive.lol/ https://github.com/fogleman/primitive Also, I made a Twitter bot that posts samples every 30 minutes based on "interesting" Flickr photos using randomized Primitive settings: https://twitter.com/PrimitivePic

Slightly off topic, but for the first time I've seen a "lol" domain :). Did you not have any apprehensions using it, like people might not take the product seriously?

Kinda, but I figured it would stand out so I went for it.

Re: Using SVG as image placeholders

#123

Post by fogleman »

erikig wrote: post #95
fogleman wrote: post #13

(Developer of Primitive here.) Love seeing people use my software in different ways! If this looks interesting to you, try it out: https://primitive.lol/ https://github.com/fogleman/primitive Also, I made a Twitter bot that posts samples every 30 minutes based on "interesting" Flickr photos using randomized Primitive settings: https://twitter.com/PrimitivePic

I love this, for budding visual artists it is a great way to see how basic shapes and seemingly simple colors come together to create evocative images.

Thanks - this is my favorite aspect of it as well!

Re: Using SVG as image placeholders

#125

Post by traverseda »

fogleman wrote: post #13

(Developer of Primitive here.) Love seeing people use my software in different ways! If this looks interesting to you, try it out: https://primitive.lol/ https://github.com/fogleman/primitive Also, I made a Twitter bot that posts samples every 30 minutes based on "interesting" Flickr photos using randomized Primitive settings: https://twitter.com/PrimitivePic

Hey, you're that guy who did "minecraft in 500 lines of python".

Re: Using SVG as image placeholders

#126

Post by baybal2 »

derefr wrote: post #26
baybal2 wrote: post #12

Earlier quoted context omitted.

SVG animation is amazing, but as a person who made work with in-browser animation and visualization my breadwinner, I can say that usage of JS for that is a huuuuuge downside Effectively, you have to rewrite a big part of actionscript functionality into your browser to do really simple things It is greatly regrettable than browsermakers have thrown out all declarative animation features, and never thought of improvin…

Is “declarative SVG animation scripting” really a primitive API you need the browser to support directly? “Rewriting a big part of Actionscript functionality” seems like the job of a JS animation framework, not the browser. Like the ones that animation tools that previously compiled to Flash (e.g. Adobe Animate itself) use.

JS animations that can approach flash level quality are hard to do.

It is like saying that you don't need native video support, but you use JS to interpolate initial image.

Re: Using SVG as image placeholders

#127

Post by baybal2 »

cisanti wrote: post #40
baybal2 wrote: post #24

I wonder, how many users here know about progressive jpeg, and about the trick with partially loading progressive jpeg file?

What is the trick? I do know progressive images and use them, others argue its bad ux seeing the shitty version first.

You create Image objects from images loaded with xhr that are, say, loaded only 10%, then you blur it with SVG or native CSS filters

Re: Using SVG as image placeholders

#128

Post by ksec »

klodolph wrote: post #77
LeifCarrotson wrote: post #61

Earlier quoted context omitted.

You didn't mention the result of your tests, but I infer that you found the 90 kB JPEG to be superior to the 100 kB FLIF/PNG? That seems reasonable, if unfortunate.

Yes, for photographs. This shouldn't be surprising. Note that the FLIF home page doesn't even claim that FLIF is superior to normal JPEG images... it only claims that it's superior to other lossless formats. For lossless formats, you can compare your desired metric (e.g. file size) for your corpus. For lossy formats, you can either fix subjective quality and compare size, or fix size and compare subjective quality. (…

Which is why we need a replacement for Jpeg. While bpg / HEVC is a lot better, sometimes i wonder if we can do more. While I can shrink a 100kb Jpeg to 50Kb Bpg and looks better, what I really want is something 100Kb Jpeg quality at 30Kb or less.

But given bpg or HELF isn't even being used yet. I know i am asking for a lot.

Re: Using SVG as image placeholders

#129

Post by klodolph »

ksec wrote: post #128
klodolph wrote: post #77

Earlier quoted context omitted.

Yes, for photographs. This shouldn't be surprising. Note that the FLIF home page doesn't even claim that FLIF is superior to normal JPEG images... it only claims that it's superior to other lossless formats. For lossless formats, you can compare your desired metric (e.g. file size) for your corpus. For lossy formats, you can either fix subjective quality and compare size, or fix size and compare subjective quality. (…

Which is why we need a replacement for Jpeg. While bpg / HEVC is a lot better, sometimes i wonder if we can do more. While I can shrink a 100kb Jpeg to 50Kb Bpg and looks better, what I really want is something 100Kb Jpeg quality at 30Kb or less. But given bpg or HELF isn't even being used yet. I know i am asking for a lot.

You mean HEIF?

It took 22 years to get from JPEG to BPG, it will probably be a while before we get something noticeably better :-)

Re: Using SVG as image placeholders

#130

Post by Adamantcheese »

fogleman wrote: post #13

(Developer of Primitive here.) Love seeing people use my software in different ways! If this looks interesting to you, try it out: https://primitive.lol/ https://github.com/fogleman/primitive Also, I made a Twitter bot that posts samples every 30 minutes based on "interesting" Flickr photos using randomized Primitive settings: https://twitter.com/PrimitivePic

I went ahead and used it yesterday to change the background image of my site to save a couple (426kb) of bytes on page load. While you recommend using smaller image sizes, it still worked well on a 1920 x 1080 image and only took ~10 minutes to run in the background with n = 2500.

I did add an additional step (as lots of extra triangles are generated with a large n like this), which is to put it through SVGOMG[1] to optimize out some of those extra bits.

That cut the generated SVG image size about in half, which I think is an excellent amount of bytes saved for relatively little effort. You can see the result on my site linked in my profile, or compare the PNG and SVG files from the source on my GitHub in this commit[2].

[1]https://jakearchibald.github.io/svgomg/

[2]https://github.com/Adamantcheese/adamantcheese.github.io/com...

Post reply on HN