015 — Fixed It!
Hey. How's it going? This is Ryan Hefner, and this is the All Play podcast. So last week, I talked about basically some janitorial duties that I had to tend to. And I'm actually I'm surprised and happy to say that, at least one of the major ones is fixed.
Ryan:So the thing I was running into was I have this service called link cards that I use to dynamically generate and render, the open graph images for basically every website that I work on. And I think I had mentioned in the show, since about February, the service has been basically just getting hammered. And I was looking into the logs, and it looked like it was this weird distributed attack. And, and I was like, I started throttling. You know, I threw Cloudflare in front of it.
Ryan:I started using their, you know, like, DDoS protection, turned on the under attack mode. That didn't seem to help. I started creating some rate limiting rules and aggressively applied those. I started just going in and trying to find as many of the, bad IP addresses that I could find and just start throwing them in there and just see if any of the if that would somehow, you know, make the server stop. And, I mean, I guess I had, you know, maybe spent, like, a couple days back in February, and it just, like, like, I just got so fed up with it that I just, I guess, I've let it sit for, what?
Ryan:It's August now. So I've basically, half of year of bay of the service being barely reliable. I I can't even say reliable. It was just it was basically unusable. And the frustrating thing is I was basically paying for a server to be hammered for, 6 months that wasn't really providing me with any value other than some headaches.
Ryan:But, I'm glad to say that I was able to resolve the issue. And so basically, what how I and how I did that is I was, like, actually apprehensive about it. I started I was like, I don't really wanna, like, put any more money at this thing. Again, it's a service that I use, so I was kind of, like, annoyed the fact that the, that it was just getting hammered so hard for, like, for for what I could you know, to for no apparent reason, other than it's just like an IP out in the world. And so at a certain point though, I was like, well, any more hours that I put into this, if, you know, depending on how, you know, based on the rate that I normally charge out for freelance stuff, even if this thing costs me an extra 10 or $20 per month over the next year, it's cheaper than me spending a couple hours, you know, pulling my hair out on it.
Ryan:So I didn't do any sort of, disk sizing stuff because because the service is actually hosted on DigitalOcean. So I was like, let's see how many, like, CPUs and RAM how much RAM I need to throw at this thing and CPUs so that this thing could actually stand up and and do it what it need to. So it was on, like, a one CPU box. I mean, it was on, like, a $5 box, basically. So I ended up ramping it up to eventually, I got to the point to where I had it on, like, a 4 CPU something I don't know.
Ryan:12 gigabyte, RAM, box, and it was handling all the traffic fine. And turns out that it might have actually been kind of legitimate traffic. I was I was kinda surprised. I actually started seeing different logs come in once I actually turned up the servers, and some of them were actually like Amazon bots and some other stuff. And once the dust had kinda settled and it seemed like the server was kinda stable, and I was actually able to start logging in and accessing it oh, and hold on.
Ryan:Let me totally back back backpedal on this. Before I had turned up the server, I had already routed the www and, like, the non ww traffic, basically, the landing page traffic to a next step. So I actually end did end up doing that. That had no effect on the stability of the server. So then I sort I started throttling it up.
Ryan:Turns out that package stats, the the npm stat viewer search kinda tool that I that I have out there, has generated almost 2,000,000 Open Graph images on this service. And, you know, because this thing had been down for so long, I I hadn't gone in and seen the, seen what was going on in there for a while. So I think some of that might have actually been, like, legitimate traffic of just, like, I guess, package stats of, you know, social share images, which was kinda interesting to see. And then it started making my mind wander. It's like, this service actually I mean, it's pretty easy to to integrate with.
Ryan:I like using it. It's a shit like, originally, back when I had you know, when I wrote it, the intention was to, at some point, you know, start throwing, like, a paywall on it and see if other people wanna use it. And I know there's other social share image generators and stuff. And obviously, you can do the the, you know, the OG image for cell thing. And, I'm not sure other if other frameworks I don't know.
Ryan:Gatsby has a open open graph image generator script I think you can run for all the static stuff, but I don't know. There's something about being able to have this thing running real time. And then it certainly can be think of, like, well, it'd be nice to actually have, you know, the generic ones that are based off, like, template, but then at the same time, if you ever wanted to override it to be able to just replace, the image that's being served there with maybe a custom one. But to do that in your code would be kind of annoying because you'd have to go in there. So I I would say the mind starts spinning.
Ryan:I think the the service is valuable just as is even, and there's probably a bunch of other things that I could end up putting around it that could be interesting. So I ended up doing a little spike on seeing what it would take to actually move the Open Graph image, generation over to render. So render.com. And the my intention there is I wanted to have a very lightweight, service running there that could essentially generate these images. If this does become popular, that's the most CPU intensive thing.
Ryan:So I would want that to be behind something that could essentially auto scale and ramp up to accommodate these images. And I think it kind of falls in line with this whole stack idea that I'm I've been kinda playing around with. I haven't really totally dived into the different layers of the of of what I'm thinking as far as API versus front end clients versus everything else as far as where I'm at on transmits. But I do have a general idea of how I would actually apply this to link cards. And then I started thinking about the name link cards, and I never really liked the name link cards because I have link cards dot I o.
Ryan:I think link cards dot com is actually some sort of weird, like, phishing site thing that, is, like, prompting about, you know, like, viruses installed on an on, on your Mac and stuff. And so then I was like, well, if I'm gonna rewrite this thing and move it over to this other service potentially, what would be, like, a good name for it if I'm gonna put in all this effort? And so I happened to just kinda be googling or not googling, but, like, look searching around on the domain name registrar registrars and happened to come across Open Graphs. And, actually, open graphs dot org was available. Open graphs dot I o, opengraphs.app, opengraphs.net, and lo and behold, opengraphs.com now granted, it wasn't just, you know, a 1299.com, sitting there hanging out, but it was a buy it now.
Ryan:And so literally since last Saturday when I ended up getting the proof of concept working on render. It did take a little bit of back and forth because there's some funky stuff you have to do with the cache directory as far as getting puppeteer and chromium and all this other stuff to be retained, between deploys and and accessible. But, did eventually get that running. Seems like it runs pretty stable. I do think I would have to, like, buy, like, right now, it's just running on a free plan, which is rad, but I think I would have to buy, something that had a little bit more memory because I think it was kinda tax taxing it a little bit.
Ryan:But so yeah. So open graphs.com. I did end up registering open graphs dot io. And I was like, well, at the very least, I'll I'll launch. I'll I'm gonna rebrand link cards and go with open graphs dot io.
Ryan:I. But that open graphs dot com sitting there on buy it now and on Namecheap is this was it sitting in the back of my head? So, you know, the week is going on. I'm kind of buried under client work. But at the same time, every second that I get to where I can kind of take, like, a little bit of a break, I'm thinking about how I'm gonna restructure what is now called open graphs into, a service, and that dotcom just kept ticking on the back of my brain.
Ryan:So I just ended up saying, screw it. This is probably the cheapest it'll ever be. Who knows? It could be cheaper, but I don't have anything on it now. And if I'm gonna go out of the gate with something, might as well just get the dotcom out of the way.
Ryan:So I ended up buying open graphs.com. I'm gonna I'm gonna try to build this thing out rather quick. I think I mean, I already have the basic underpinnings of it for link cards, except I'm gonna that's currently a Laravel app. I'm gonna actually transition it over to this kind of next nest, hybrid. The and, yeah, that's that's where it's at.
Ryan:I'm way over on the 10 minute mark on this one, but wanted to just do a little update on that whole janitorial thing. And the fact that I got that service running, the fact that I'm gonna spin up, Open Graphs as a service. I'm actually just gonna try to get a few of the sites that I currently have ported over to it and start testing it on this new, on this new stack. And who knows? Maybe this will actually end up being the first official like, I'm calling the the stack that that I'm kind of, like, conceiving called PlayStack.
Ryan:But this might be the 1st PlayStack instance, up and in the out in the wild and start testing this thing out. So you can actually find a holding page. We're gonna have to go back and do some, updates to the copy and stuff. I just threw something up there real fast, but it does have a email sign up. You can find it at open graphs.com.
Ryan:That's open graphs, plural with an s. Yeah. We'll see where it goes, but kinda stoked on the the domain. Got a bunch of ideas on things I think I would like to do around just having that service. I think it could be both Open Graph image generation as well as optimizing Open Graph tags and and maybe, who knows, doing a bunch of other different stuff with different integrations, whether that is in a WordPress or Ghost site or Webflow or, you know, one of the various React, Next, Svelte, Remix.
Ryan:I guess I I guess actually React router, Astro World of Things. We'll see where it goes. And I am also still working on transmits and actually have started laying out the home page and some of the other interior pages of the actual marketing site just to kinda see it as an exercise to better wrap my head around how I wanna position transmits because, obviously, there's the audio journaling part of it. There's also just the whole audio hosting slash embeddable players slash API, all this other stuff that, I have in store for it. And, actually, working on the marketing site is helping me try to find a little bit of clarity in the positioning on that.
Ryan:So working on open graphs, got the transmits landing page in were in the works as well as tweaks to the actual current journaling app that, I'm working on. So a lot of things in flux or in, I don't know, in some in various states. And we'll see where I get at the end of this weekend. Who knows? Maybe there'll be another update on Monday.
Ryan:But, alright. I'm very over. Alright. I'm Ryan Hefner. This is the All Play podcast.
Ryan:You could find me online at ryanhefner.com. You can find me on Twitter @ryanhefner. You can find the show at allplay.fm and on Twitter @allplayfm. Alright. Have a great one.
Ryan:I'll talk to you later. Bye.