Tweet archive

@ledbetterjoshau I mean I *do* like the sound of that but I think someone beat me to it 😬 https://t.co/SfxM5EG550

A little quick start guide is here: https://t.co/7UABub0dMB

It adds og:image social previews for biblemunger, and can be forked and extended for other use as well: https://t.co/TRNnpuCDLt

In case it helps anyone else, I did add real documentation to my og:image generator https://t.co/gqJ1nscBBS

@mrled Hey at @flayyer_com we support responsive og:images per social network, analytics and you don't have to worry about infrastructure. There is a free plan you should definitely try:)

ugh who wrote the docs for this they're awful https://t.co/EJQOAi2ZA4

(Previous thread: https://t.co/nRtVhkj6zw )

The only difference between this way and what I was doing before that ran into the 50MB Lambda function limit is that my new https://t.co/cjdzXnvI0H is deployed as a completely separate site. It'll never do anything but screenshots, so it should always fit in 50MB.

This means if you link to a specific munged verse, the whole text will show up on Twitter and Facebook (as long as it isn't such a long verse it gets cut off). And if you link to a whole-bible munge, it'll pick a verse and show that one.

So I reimplemented my in-project puppeteer screenshotter as an external one, and now that's what I use.

It is true that @vercel_support told me puppeteer wasn't recommended on Vercel Functions... but then I found Vercel's og-image and guess what it uses to generate text? 🙃 https://t.co/voYvd6DM4m

This way is now using a brand new og:image generator that is deployed separately. It does nothing but install puppeteer and run it against specific URLs https://t.co/Czv8w4OplC

Social previews now working for biblemunger 😈 https://t.co/IiaamOEgn2

I *could* do something similar, except have it actually load my /preview/... pages. To avoid abuse, I could allow only whitelisted domains. I was trying to avoid service interdependence (to keep these personal projects less complex), but... hmm. I'll think about this.

I also found this Vercel-hosted API for making images containing just text on the fly, intended for og:image of blog titles. Interesting that they're actually using Puppeteer for this -- even though @vercel_support says it isn't well supported 🙃 https://t.co/K6htk44K73

Anyway, back to Vercel, a Twitter search found both success and failure reports of people trying to use Puppeteer with Vercel. Also, maybe this is why I'm only hitting the limit with biblemungerjs and not cistercianjs, which is (slightly) smaller: https://t.co/VjSst9TPzR

But it would be cool if I could specify that the social sites - Facebook for og:image, Twitter for twitter:image, etc - should load some specific URL *and screenshot it* and use that as the social image.

...and then returns the screenshot as "Content-Type: image/png". It works great! (Except for generating Lambda functions that are too big.)

Basically my code (in cistercianjs/biblemungerjs) includes a /preview/... route that generates JUST the cistercian glyph / single munged verse, without any headers or input fields or anything, and I have an /api/preview/... route that loads that in puppeteer and screenshots it.

What this makes me wish for is a way to ask social platforms to take a screenshot of some other URL and use that for the og:image or twitter:image.

Anyone have a good suggestion for a very efficient/small NPM package that can take screenshots of web pages? Must support webfonts and fit easily in a Vercel function.

I reached out to @vercel_support and they said basically Puppeteer isn't a good fit for Vercel Functions, which is a bummer but understandable

Not sure why - both cistercianjs and biblemungerjs are small projects under 2k loc. biblemungerjs does have a 5MB sqlite database too, although that's not used from the lambda that does screenshotting.

Bah. Tried this same approach on https://t.co/N5g8iutnCv, and it works great -- but only from my laptop. The resulting Lambda functions are too big to deploy on Vercel :(

nice https://t.co/oKBp1IUiGc

Then it took me longer than I would like to admit to actually get the images working nicely in Facebook/Twitter/Slack, quite a few commits in there just trying various settings, image sizes, etc. But I got it working 😎

Turns out there is a very stupid way to do this: use puppeteer to run a whole ass headless Chrome on the server, and take a screenshot of that. https://t.co/xTS9Go6DKZ

I am proud of how cursed my implementation of this is. I thought to myself, I'm already generating exactly what I would want to be in the social preview image on the page itself. Is there a way I can just take a screenshot of some React goop on the server?

nice

Figured out how to automatically generate social previews on the server side. I hope this works: https://t.co/CIRp3LsW8J

https://t.co/fStEbRJEtY

https://t.co/Bddx1bmG8w

We've all been there, Noah https://t.co/FfE5yPAuYl

https://t.co/LAjxvGEgq8

Update to one of my oldest projects: a text/replace joke automator for Ye Holy Fcripture https://t.co/DpRiYJBh9n

The munge page can get you started with some suggestions if you want to play but don't know how: https://t.co/Gg31aX3YNU

It's based on a series articles from The Toast (aww man, remember The Toast?) https://t.co/UCBX7aJkw4

This is what it looked like before. (What's a "mobile version"?) https://t.co/EEtQj3q6Tr

And the typography looks really good. I could never have done this 4 years ago when I wrote the first version. CSS confused and frightened me. My friend Ben did the design for this version, and I adapted it to tailwind and made changes and it looks SO GOOD.

It now has a nice homepage that cycles through single-verse munges that I think are particularly good https://t.co/ssNKsTjjwn

A huge update to one of my favorite personal projects: biblemunger is now very pretty :) https://t.co/M7q9RSKmtb

It's a cool notebook that has lots of modifications. You can keep several refill packs in the leather cover, and swap them out when they get full. There are lots of pouches, attachments, and refill types. A fun system. https://t.co/x3SNCNPwlS

I also use a Traveller's Notebook as a personal journal. It's a beautiful notebook that I fill with shameful chicken scratch. https://t.co/C7Keo18Il8

The cover is cloth and the front is embossed with graph lines, so I did a pencil rubbing of it to practice my ~*~beautiful arts~*~ before committing to drawing all over the real thing https://t.co/FDN37OzrST

The symbols on the spine and at the top of the front are of course Cistercian numerals. https://t.co/RNXtP0l0Cv

I realized the other day that metallic markers would probably look cool on the front cover. Got the markers in today, and they look great! https://t.co/JNd66uqQ6Z

I'm not much of an artist, but I do love graph paper. The inside of the notebooks have a bunch of different kinds. They work very well for diagrams and drawings, but I do use them for text notes a lot too. https://t.co/Q7JNpHGAMe

I found these lovely notebooks via Zak S in this post: https://t.co/HAqVjzlEcB

Fun with notebooks... https://t.co/jtovqNoBce

Some manual practice https://t.co/0uj8niG0EL