This will make it impossible for blind people to post a comment. There are ways around it, but one has to be aware of this issue.
Your initial "puzzle" can be solved with 8 characters of JS: eval("23+47").
Your SVG picture can be solved using off-the-shelf OCR like Tesseract.js.
Even very challenging reCAPTCHA reading tests are mostly solvable by spammers.
You'd be better of using something with thousands of expert person-hours behind it, like reCAPTCHA v2.
The puzzle will be sent as an SVG, obviously.
Em.. "off-the-shelf OCR" sounds neat, but anyone who knows such words isn't an average spammer. The goal of basic SVG puzzles is to block 99% of the spammers who just type dumb comments on keyboards. The rest 1% can be taken care of by human mods.
TBH, I don't like the reCAPTCHA-like solutions. They are just annoying from my personal experience and if they rely on any 3rd party service, I'll give them a hard pass for this reason alone. My approach is to use trivial SVG-style captchas with adjustable complexity, e.g. instead of asking "23+34", we can ask "log(32)/log(2)" and effectively filter out everyone except people familiar with math, or "md5(2615), first 7 hex digits" and let in only people familiar with cryptography. Forcing users to detect birds and crosswalks will just make them upset, IMHO.
I work on a site with 10 million monthly pageviews and spammers register on a form that has recaptcha and email verification... and we tried hidden input fields and other tricks, but each day we have consistently had 5 new spam accounts. With SVG they can just take a screenshot of what a user sees and send that to OCR. Complex math will turn away as many legitimate users as spammers.
The only real way to stop spam is to use a 3rd party API to detect it, or use something like a karma system that builds up over time. I think we're at the point where simple solutions won't work well unless you have a small site.
It's an XML document that should be easier to figure out than a raster image format such as jpg or png.
Granted all you need to do is render it to a canvas but that’s an extra step on top of everything you need for a raster image, I’m not sure it’s easier.
I used a bunch of one-word-answer questions for over a decade now for sucessful spam prevention — trivial for a determined attacker with the time and resources to circumvent (and similarily trivial for me to replace with something else).
This also means for a decade I didn’t ship my user data to google.
Unless you are a really juicy target fending off the bots is enough.