By "SVG can do that?", it appears they actually just meant "JavaScript can do that?", as all the cool animations and stuff are all just JS-driven. Unless I misread it?
Totally agree with you!
181–190 of 202 posts
By "SVG can do that?", it appears they actually just meant "JavaScript can do that?", as all the cool animations and stuff are all just JS-driven. Unless I misread it?
Totally agree with you!
Earlier quoted context omitted.
When I started learning React, I realised a dream of mine could finally come true: a proper Celtic Knotwork generator. Uses SVG and React together in harmony. http://celtic-knotwork.online
Pardon my ignorance, but aren't these patterns just composed of certain tiles in rows and columns? This is something you can do equally well with raster graphics, so what's the gain of using SVG here?
The "double corded" style paints one side of a cord red and the other blue. The problem comes when the pattern changes what side is which. You can play around with it to see - put in some breakpoints and you'll see the "sides" switch on some cells. This can't be done with tiles.
The tile manipulation is actually no simpler than drawing SVG, because the hard bit is calculating the entry and exit points for each tertiary cell. And SVG produces better results :)
I also plan on doing some more stuff with it someday - like deforming the grid by moving the corners. This is pretty simple with SVG but would be really hard with tiles.
Earlier quoted context omitted.
When I started learning React, I realised a dream of mine could finally come true: a proper Celtic Knotwork generator. Uses SVG and React together in harmony. http://celtic-knotwork.online
Awesome. Is the code for this open source? (I'm just afraid the world could lose this should you decide to take it down some day!)
It's always been a curiosity of mine why SVG didn't get more attention from browsers through the years to solve the performance issues. It's open source, cross platform, "dynamic" in a sense AKA no compiling needed, light weight, supports shapes and text, offers immediate responsiveness, etc. Why the lack of love while we pour ever increasing energy into mangling HTML and CSS and every six months a new JS framework/m…
Earlier quoted context omitted.
> has a number-of-elements performance ceiling if you're drawing things rather than using images, which feels like it defeats the purpose. Well you can generate your imagery programmatically and then render it to canvas as a raster image. Canvas is not purely for implementing a web based drawing app.
Software rasterisation is slow and power-inefficient, and does not scale particularly well with screen size.
Earlier quoted context omitted.
> has a number-of-elements performance ceiling if you're drawing things rather than using images, which feels like it defeats the purpose. Well you can generate your imagery programmatically and then render it to canvas as a raster image. Canvas is not purely for implementing a web based drawing app.
But you can also embed a raster image in SVG.
SVG has the opposite performance profile of Canvas. SVG hits a performance ceiling as number of elements increases. Canvas, since it's rasterized image can handle a rasterized representation of millions of SVG elements. However as Canvas dimension increase, it will hit a performance ceiling.
(Edit moved to here from the wrong thread) This comes up on each SVG thread and I post the same comment each time (so excuse me if you've heard this from me before). We render SVG that contain beyond 100k nodes in the browser and find that it works fine. You need to be careful with your manipulations and we've developed a couple of tricks to keep things snappy, but the final experience is great. Here's a demo of it i…
Earlier quoted context omitted.
Cool, could you please explain what are they? To me, personally, SVG is the last resort.
In brief, our product includes a web-based process flow component, typical nodes-and-edges kind of thing. Much better done with SVG IMHO, with first-class support for box & line modelling and styling. But the powers-that-be decreed we'd do it all in HTML & CSS.
Earlier quoted context omitted.
In brief, our product includes a web-based process flow component, typical nodes-and-edges kind of thing. Much better done with SVG IMHO, with first-class support for box & line modelling and styling. But the powers-that-be decreed we'd do it all in HTML & CSS.
nodes-and-edges thing is the classic problem that is perfectly solved by SVG. Other than that it's quite useless though IMHO.