As a designer, I like to use svg for their small file size and crispness even when resizing. When I incorporate e.g.. public/image.svg, the v0 code type through (?) seems to take forever as it is mostly numerical, non sensical, data. I hope this makes sense. It individually parses the code within the svg file and it appears to be a slow-ish typewriter as it process and displays the code from the file.
Hey, Jay
Could you show us a chat to demonstrate what you mean? Itâd help us understand this feedback better
If you mean syntax highlighting, it appears that it is not enabled for SVGs:
If you mean that it takes v0 a long time to generate an SVG, thatâs because v0 is doing just that â it is generating an SVG file just like v0 generates the rest of the files in the project.
SVGs and other niche output structures tend to take longer for AI models to generate, because they have to use smaller tokens (and therefore more tokens) for things they werenât trained on as much or more precise data.
So v0 actually is âtypingâ out the file. It streams the file as the AI generates it, so it looks like the AI is typing.
If you meant something else, I guess I missed it. Sorry.
Hey Pauline and BC,
Yes, today I tried to grab a Loom of what Iâve been experiencing but no luck. But⌠to BCâs point:
âSo v0 actually is âtypingâ out the file. It streams the file as the AI generates it, so it looks like the AI is typing.â
Iâm not asking it to generate svgs for sure. In my projects, I have imported svg with a prompt like âuse this as a section head instead of the text, .â And what I see is v0 typing out the file as it incorporates it into the codebase. This is tedious when Iâm used to just referencing an image url from /public, /img etc as a png, svg etc..
So, to your point BC, I think that React is taking my source and incorporating it as code into the codebase rather than an external link. Which is fine, thatâs likely faster to render but the âtyping outâ part is rough.
Whatâs weird is I added some modified SVGs (since it didnât like my SVG if it had more metadata beyond last night and v0 just pushed it to blob storage. Didnât incorporate into existing /public or type it out just added as an external link.
IDK, donât think this is a bug but if I can repro I will screen record for improved UX feedback.
@jayhilwig It sounds like to me (I may be wrong) that v0 is generating an SVG even though you told it to just use an SVG file you uploaded? How are you uploading the SVG file (if that is what you are doing)?
Do you expect something like this, but you see âGeneratedâ instead of âAddedâ?
So this is what I mean, itâs more about the parsing of the svg data. In this Loom video, the svg remains unchanged, yet v0 painstakingly types through the data of the in the svg. I think this is my lack of understanding of how React or ??? want to incorporate my 2kb svg into the codebase but it does not seem super efficient IMO.
FWIW: This is a full 30 seconds of watching v0 type the svgv0 data and it does this every time I prompt for changes to the svg. I recently added 6 svgs to this same project and OMGs.
@jayhilwig Ah, I see what you mean! Are you expecting v0 to only update part of the file or scale up the icon instead of re-creating the whole thing?
In that case, I have some feedback for the v0 team. I think it would be very beneficial to v0 if it could apply diff edits, where it provides a diff instead of updating the entire file every time. Itâs a bit hard to get models to do, but with the right prompting it saves a lot of time and tokens!
@pawlean and other Vercel team members, please see above
thanks @bestcodes the other day, after updating 2 svgs in a text editor to remove the metadata that v0 didnât like, it auto magically put them in a Vercel Blob store. So, I could no longer view the code (strings of numbers etc). This, to me, seems ideal. Iâm not sure why anyone would need to view or edit SVG data (not human readable). When I click on the SVG in v0 of the Blob file, it just shows a preview of the image in v0. And whether its hosted from blob store or included in my /public/img codebase, either should just show an image preview.
The ideal behaviour is putting the svg in Vercel Blob, right? Can you see the image preview in v0?
I donât know anyone who has ever had to edit SVG data
Hey @pawlean yes I can see the image preview in Preview window. I asked v0 to move all my others to Blob storage for consistency. I guess itâs a question for ENG, if React etc.. want to incorporate the raw svc inline into the codebase???