Earlier this month, I discussed how Chrome's upcoming built-in AI support was adding new features specifically tailored to certain use-cases. In that post, I looked at the Summarizer API. For today, I decided to take a look at the rewriter API.
As a quick reminder, this is very early on, and if you want to try this yourself, you should hit the sign-up form and read the intro post from the Chrome folks first. Obviously, everything I'm going to show below probably will, almost certainly will, change before shipping.
Ok, with that out of the way, let's talk rewriting, specifically, how the Chrome API operates. Given a set of source input, the API can shorten, or lengthen the input, as well as help modulate the level of formality of the text. Another example would be to, well not "dumb down", but simplify text for audiences of different technical abilities.
One of the reasons this excites me is the specific use-case of shortening content. I feel like this is something I've hit many times in the past. I'll be using a form on the web, enter some text, and then be told I need to shorten my input. (By the way, if your form doesn't provide real-time feedback about this, that's a UX issue you need to correct. See my post from last year on how I did this with Alpine as an example.)
As a way to see this in action, I built a quick demo that provides a text area for input and then provides a shorter version of your text:
In case it is difficult to read in the screenshot, my input was my typical bio:
Raymond Camden is a Senior Developer Evangelist for Adobe. He works on the Acrobat Services APIs to build powerful (and typically cat-related) PDF demos. He is the author of multiple books on web development and has been actively blogging and presenting for almost twenty years. Raymond can be reached at his blog (www.raymondcamden.com) or via email at raymondcamden@gmail.com.
Thrilling, right? You would definitely hire me as your next GenAI Evangelist I bet! After using the built-in AI service to shorten it, the result was:
Raymond Camden is a Senior Developer Evangelist for Adobe. He's the author of multiple books on web development and has been blogging and presenting for nearly 20 years. He can be reached at his blog (www.raymondcamden.com) or via email at raymondcamden@gmail.com.
I got to say, I think this is the most impressed I've been so far with these proposed APIs. For the heck of it, I took this output and fed it back in. The result was:
Raymond Camden is a web development evangelist for Adobe. He's the author of several books, blogs, and presents regularly. You can contact him at his blog or email.
To be honest, that's dang good. And because I'm crazy, I did it again:
Raymond Camden, Adobe web development evangelist, writes books and blogs and gives presentations. You can contact him at his blog or email.
Again, great result. It would be stupid for me to do it again. So I did it:
Raymond Camden writes books, blogs, and gives presentations. You can contact him at his blog or email.
At this point we are down to 17 words. Let's do it again:
Raymond Camden blogs, writes, and presents. Contact him at his blog or email.
Just 13 words. And yes, I did try again and it wasn't able to make it shorter. In theory it could have gone with "Mr. Camden", but honestly, I'm pretty pleased with the iterations.
Let's look at the code. I'm going to 'paraphrase' a bit from the Alpine.js bits. After you determine if the browser supports it, you can then create a session:
session = await window.ai.rewriter.create({
sharedContext:'You help shorten text',
length:'shorter'
});
I feel like sharedContext would normally be more tuned to a particular kind of content. So for example, if this were helping writers on a site dedicated to cats, the context could be modified to discuss that. For length, you have values for shortening, lengthening, or keeping it as is. There is also a 'tone' setting that lets go for more formal and casual.
Once you have that, this is all you need to do:
let newText = await session.rewrite(input);
And that's it. Incredibly simple. I will share the CodePen below so you can see the full code, but 99% of it is Alpine.js and, again, it won't work for you outside of Chrome Canary. That being said, I am curious what you think. Leave me a comment!
See the Pen window.ai - shorten by Raymond Camden (@cfjedimaster) on CodePen.
```