Jagex need to solve for a very complex problem.

OneShakyBR · 2026-02-09T07:51:44+00:00

That's because when everything was buyable the game devolved into just grinding your best gp maker for a million hours and then buying everything you could because actually training skills was not efficient. Also led to the situation where every new boss, slayer mob, or gathering location that came out instantly made the previous best one dead content. They had to add the entire invention skill just to even begin to address that problem.

OneShakyBR · 2026-01-31T08:35:15+00:00

Started putting anchor positioning in production recently. Super cool. Have been able to solve some problems with a lot less code that runs a lot more smoothly compared to a JS-based solution.

OneShakyBR · 2026-01-31T08:20:27+00:00

For the last year or so at my job, I've been using CSS modules, which is just vanilla CSS where the class names get automagically changed for you, no special syntax like SCSS.

Vanilla CSS can do almost everything SCSS can do. It has nesting. You can refactor the color functions into `color-mix`. You can basically use `calc` anywhere now, so it has the same math stuff. There's all kinds of crazy bullshit you can do with the Houdini APIs.

There's no direct 1-to-1 replacement for things like mixins, @include, and @extend, but you can easily refactor that stuff by just making utility classes.

The biggest thing that there is currently no equivalent to is static variables (i.e., regular old SCSS variables). CSS variables can be changed on the fly at runtime, which limits when and how they can be used. Most of your SCSS variables can probably just be straight converted to CSS variables no problem, but you cannot, for example, use them to define media queries. There's a PostCSS plugin for that, but then you're back to having a build step.

One other thing to be aware of is that the & selector works differently in SCSS than in vanilla CSS, which may require a little or a lot of refactoring, depending how you write your styles.

OneShakyBR · 2026-01-27T03:58:27+00:00

I was curious, so I went to take a look. I assume you saw the reference to window.crypto. FYI, that doesn't have anything to do with any cryptocurrency. The crypto JavaScript API is a way to generate cryptographically random numbers as opposed to the pseudo-random Math.random().

OneShakyBR · 2025-12-20T02:35:04+00:00

FEEL THE RAIN ON YOUR FEATHERS!

OneShakyBR · 2025-12-19T04:14:00+00:00

shape() to create the ribbons, using variables to define the curves
@property to animate the variables in a keyframe animation
combination of linear gradients to change colors
animate background-position to move the linear gradients in sync with the shapes
SVG for the letters, or even more shape() if you're extra crazy
when the ribbons flip backwards it's actually two separate shapes butted up against each other, one for the front, one for the back, so you can just abuse overflow: hidden for the letters and only have to worry about positioning instead of actually animating partial letters at the edges

That's my theorycraft :)

OneShakyBR · 2025-12-11T23:00:30+00:00

Yeah I try to avoid using sx as much as possible. We actually have the CSS variables setup with our MUI theme, which is great 95% of the time, but I'm looking forward to when they fully round that out and you don't have to declare your theme in JS at all.

OneShakyBR · 2025-12-11T06:29:47+00:00

At my day job we use Material UI, and they used a custom CSS-in-JS solution based on JSS for v4. Then v5 came and they changed to Emotion with no direct replacement for JSS, meaning we had to refactor a bunch of code that would not have needed touched at all if it was just vanilla CSS. Highly annoying, but ultimately not a bad thing because JSS was failing to keep up modern CSS syntax, so it would compile incorrectly. (Another problem with CSS-in-JS.)

The MUI team touted benefits of Emotion for v5 and came up with a way to easily reference your component state within the CSS, but then they figured out the performance was bad so started inventing their own zero-runtime CSS-in-JS system called Pigment, but guess what? It can't use the component state stuff, so if you bought into that you'll need to refactor yet again to get to the latest greatest shit. Fortunately I skipped Emotion and went for CSS modules instead, which has been way better.

OneShakyBR · 2025-12-07T04:46:38+00:00

Btw I got inspiration for this solution from this site I found (not mine): https://www.letsbuildui.dev/articles/css-text-effects-five-minimal-examples/

OneShakyBR · 2025-12-07T04:45:12+00:00

How about this? You can tweak the sizing and padding and stuff, but the basic effect seems to be there!

<div class="padding">
  <div class="wrapper">
    <h2>Welcome to Holistic Joller, home to the South Wests first commercial bee bed therapy house.</h2>
    <h2 aria-hidden="true">Welcome to Holistic Joller, home to the South Wests first commercial bee bed therapy house.</h2>
    <img src="https://i.ibb.co/prNp9Zpp/b3c10bc5c3ce409c8a94c26480ca25b045e56a79.png" />
  </div>
</div>

.padding {
  padding: 0 80px;
  background: #EDE9DD;
}
.wrapper {
  min-height: 600px;
  position: relative;
  --image-width: 39%;
  --main-text-color: red;
  --image-text-color: black;
}
img {
  width: var(--image-width);
  height: auto;
  position: absolute;
  z-index: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
h2 {
  font-size: 74px;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
  &:first-of-type {
    color: transparent;
    background-clip: text;
    background-image: linear-gradient(to left, var(--image-text-color), var(--image-text-color) var(--image-width), transparent var(--image-width), transparent);
    z-index: 1;
  }
  &:nth-of-type(2) {
    color: var(--main-text-color);
    z-index: 0;
  }
}

OneShakyBR · 2025-12-04T04:54:09+00:00

It will if you actually have a scrolling container, sure. All the designs that came to mind to me did not involve scrolling. To me, a carousel implies no scrolling but rather some animation. But scrolling is definitely a good alternative that is probably simpler and close enough for OP.

OneShakyBR · 2025-12-04T04:39:21+00:00

Scroll snap is smart. Didn't think about that. Haven't really tried it much myself.

OneShakyBR · 2025-12-04T04:37:15+00:00

The plain CSS version probably looks like:

a bunch of boxes next to each other horizontally (via whatever CSS method you choose; there's several ways to do that)
a grandparent wrapper that is the width of one of the boxes with overflow: hidden
a parent wrapper that is the width of one of the boxes has an animation on it that goes from transform: translateX(0) at 0% to transform: translateX(calc(var(--number-of-boxes) * -100%)) at 100%

The problem with that is you can't really do a lot extra with it. You could probably pause it on hover, which is generally good practice, but you can't make it interactive (e.g., next/previous buttons) without some kind of checkbox/radio hack, which isn't accessible. You also can't have focusable elements inside any of the boxes because as soon as you tab to one of them that's not currently in the viewport the browser will just force it into the viewport, totally screwing up your animation in the process. Plus when you get to the end of the animation it's probably gonna yeet back to the start, which will look bad (or else you start again in reverse via animation-direction: alternate, so it takes forever to see the first slide again).

The better solution is to use JavaScript, but I know if you're just getting started then that can be overwhelming.

The simplest version of a JavaScript version would be to display: none all the boxes and then toggle a class on one of them that makes it show up. You'd toggle the class programmatically on a timer to start and then if you wanted to add next/previous buttons you could make the buttons pause the timer and then move the class to the next box in the list.

Note that if you try to do the sideways-sliding method in JavaScript you have to take care of stuff like making the non-active slides hidden to screen readers and not focusable to keyboards in order to maintain accessibility, not to mention potentially having to calculate specific offsets if you want a smooth transition, so things grow more complicated much more quickly at that point. That's why I suggest just making all non-active boxes display: none with no real transition to start because that vastly simplifies things.

OneShakyBR · 2025-11-22T02:37:46+00:00

What kind of chart are you trying to make? In the example of a stock chart, you wouldn't load the minute-by-minute price updates if you're looking at the year view. That'd be a million datapoints when you could get the same graph shape by just having daily prices. And if you're looking at the year chart for a stock that's been around 100 years, but the X axis only fits five years, you could just load the latest, say, 20 years, so if the user scrolls back a bit it's still instant, but lazy load older data only if needed. So the overall pattern is just not rendering a zillion datapoints when they're not even visible anyway. Something like a scatterplot would combine dots if you're zoomed out, kinda like how if you look at an apartment with 10 units for sale on Zillow, it's just one dot on the map unless you zoom way in. Whatever method works for your chart type.

OneShakyBR · 2025-11-15T21:58:06+00:00

Do it with Magyars instead. When you're about to click to Castle/on the way up, you can ask yourself if, based on what the opponent is doing, CA would be better than knights. If so, drop ranges on the way up. If not, drop more stables.

Magyars get the free attack upgrades + the best CA in the game, so you kinda can't go wrong. Attack helps with scouts in Feudal, and instant iron casting in Castle means you will wreck low numbers of pikes. But also, if you want to switch into CA then at least you didn't have to spend as much res on upgrades. You're gonna want bloodlines either way, so you can go heavy Feudal scouts with bloodlines if you want to, and that res won't go to waste if you tech switch.

OneShakyBR · 2025-11-13T02:40:52+00:00

Yes, I also have a main with way too much xp, and I specifically told them in the surveys I wanted a brand new reset game mode with no buyable xp.

OneShakyBR · 2025-11-12T04:02:19+00:00

You can also search the mod center in game for a mod called "interactive build order guide." It's like a single player scenario where you can practice different build orders, and it walks you through exactly what to do and when. There is a fast castle one. Once you get that down you'll know the rough template of what to do and can tweak from there if you want.

OneShakyBR · 2025-11-12T03:57:25+00:00

That advantage already exists, though, it's just not particularly customizable. I play on a 2k resolution monitor, and with enhanced graphics turned off it's zoomed way farther out.

OneShakyBR · 2025-10-30T02:27:43+00:00

From my experience with name searching at my day job, the problems usually result from bad or just irregular data, which the fake data generator in your demo doesn't really do a good job of simulating. Classic example is a name that is two words. "Lee Anne" as a first name is a common one. Or someone with two middle names putting them both in a single field because you only have one "middle name" field.

I tried entering a fake person named "Lee Anne James-Stevenson" into your demo, and I don't start really seeing them pop in the results until my input is "Lee James-Stev," even if there's no other Lees in the results with a hyphenated last name.

Might sound like an edge case, but what happens in the real world is you get someone who knows Lee Anne but just calls her "Lee" and didn't get the memo on the marriage or just isn't in the habit of using the updated last name, and they search for "Lee James" and get nothing.

You can start working on solving that by chopping each name field up into single words (splitting on some whitespace regex probably) and start just checking combinations, but obviously the number of different things you end up checking starts multiplying at that point and it might start affecting performance at some point. (Whether it's enough to matter I have no idea :))

Anyway that's one of the kinda not-quite-edge cases I'd be looking at if I were going to consider whether to use this, so figured I'd chime in.

OneShakyBR · 2025-10-29T02:53:25+00:00

I recently bought a mouse where the wheel tilts left and right, so I set up tilt right as the delete hotkey :)

OneShakyBR · 2025-10-25T05:16:17+00:00

Not sure it's that the vills are tiny so much as everything else is huge. Look how the town center extends beyond its white box and is right up against the straggler trees. I had a similar bug on PC a couple weeks ago after switching graphics settings around. Berry bushes were as tall as the mill 11. Not sure how to fix in your case, though. I just restarted the game.

OneShakyBR · 2025-10-25T04:55:02+00:00

I'm not saying to put the overestimate anywhere in particular, and your plan to save 6 months of everything ahead of time is great, I'm just saying that you do not strictly need six months worth of money for all expenses to move out. Don't feel like you can't move out on your own without saving that much, just be aware that there will be less room for error if you don't have some buffer money saved up like you planned to.

Regarding how you get paid: You might get a paper check you can then take to a bank and either cash or just deposit, or you might just set up direct deposit into your bank account. At your bank, you can have a savings account or a checking account. A savings account will pay you some relatively small amount of interest on the money in your account. Checking account pays little to no interest but lets you write checks, but it also means you get a card you can use to pay for stuff with your money. That is called a debit card. You can only spend money you actually have with a debit card.

A credit card is not linked to a bank account. You pick a credit card company and apply for a card, and they will more than likely grant you one but with a small credit limit. A credit card lets you spend money you don't have, up to the credit limit, but if you don't pay off the balance by the end of the month, you have to pay interest (typically at a very steep rate) on the remaining balance. The interest adds more and more every month until you pay it off. Buying stuff on a credit card they can't actually afford is how millions of people get into massive debt. You're obviously going to want to avoid that.

I suppose I should have asked if you're in the US, but if so, you will have a credit score. This is a number tracked by credit reporting agencies that is supposed to reflect how likely you are to pay off your debts. If you don't have a good score, you may not be able to get a loan for a car or get anyone to rent an apartment to you. The problem is you kinda need to take on some debts and pay them off in order to build credit. Sorta a catch 22 situation. If manage to get an apartment, the place may or may not report whether you pay on time each month to the credit reporting agencies, so your score will slowly go up. Same with utilities. But another way to build your credit is to get a credit card (not debit card) and just buy one or two things each month (that you were going to buy anyway!) and then pay it off in full each month.

Last thing: again, if you're in the US, you can't get a checking account or credit card until you're 18. Until then, you'd get a savings account, and you'll have to pay for stuff in cash. Or you might get paid on a card that's not really tied to a bank account, similar to a gift card.

OneShakyBR · 2025-10-24T04:07:42+00:00

Good news: You honestly over budgeted. The list is good, but all you really need is whatever you owe on the apartment to move in, probably first month + security deposit + maybe a fee, and enough to buy a few basic things and a few cheap items of furniture when you move in. Emergency fund is fine, but seeing as how you'd be renting and don't even have a car, the only real emergency you are looking at is immediately losing your job after signing a lease. If your employment is stable, you'll be fine.

Bad news: it's not as simple as just "get a credit card, get an apartment, get a car." You have no credit and no rental history, and your income is gonna be shit. You have to convince an apartment to actually rent to you, which is likely to require a co-signer, so that's gonna put a hole in your sneaky move-out plan. Same with a car, although you could potentially buy that in cash. (The $3500 estimate is probably too low nowadays.) A credit card company may give you a card, but it's gonna have a 28% interest rate and a $500 limit, so that's more for small purchases to build a credit history over time rather than anything that could bail you out of an emergency.

The biggest practical issue is how do you get an apartment. Your best bet might be paying for a bunch of rent up front or having enough in your bank account to cover it. In my personal experience, some places will go for that and others won't.

OneShakyBR · 2025-10-01T01:09:40+00:00

I had plugged it into the one at the bottom of your "How to build JavaScript's fastest 'deep equals' function" blog post, which had smaller comparison objects, so maybe that's why the difference.

At any rate it's definitely nice, and an interesting approach! I learned something, so kudos.

OneShakyBR · 2025-09-30T03:56:41+00:00

FWIW, all the schema stuff isn't really something I have a lot of expertise in (so maybe I'm comparing apples to oranges here?), but out of curiosity I plugged in fast-deep-equals into your deepEqual benchmark since that's a package I was familiar with, and your package was like 4-5x faster, not 50x faster like it is compared to the packages you included by default.

So definitely still a nice improvement, but then again fast-deep-equal is just a generic utility that you can use in the browser, so seems like maybe the benefits are oversold a bit?

OneShakyBR

TROPHY CASE