Spent a whole day figuring out a weird bug with svelte-spa-router only to find out, it's "on purpose" (which is programmer for "ooops uhhhh yeah I totally meant the"):
One reason people hate SPAs is things like this. Clicking a link loads a new page.
The end. Full stop. Don't be fancy unless I tell you. You load the page again when I click the link. What's svelte-spa-router do?
Change two variables and then OOPS it's up to you dude to figure out how to make that work like an actual link does everywhere else.
So, with svelte-spa-router you CANNOT treat your svelte routes like pages because of this bug. And it is a bug. You have to treat each route pattern like it's a singleton instance that run onMount once and once only, then you have to sort out changes within that same route.
I also think the distinction is so arbitrary. If I go from / -> /series/1/ then that causes onMount to re-run everytime because svelte-spa-router thinks it's a "new URL".
But, if I go from /series/1/ -> /series/2/ then it doesn't because "that's good for SPAs"? What?
Both actions are "new URL locations" and should work exactly the same. Just because svelte-spa-router has parameters doesn't mean that it suddenly gets to decide that parameter URLs are not real URL location changes. Nobody *ever* expects that behavior.
• • •
Missing some Tweet in this thread? You can try to
force a refresh
I have a couple of new gotchas for people doing Svelte:
1. fade:out, or almost any "out" transition effect is death. Avoid at all costs.
2. {#await} on a promise is great, but if you update the promise it reloads the *entire* DOM at that point. Put it into a component.
For #1, the demo involves this fade:out on the Spinner I use to show the video is loading. Seems harmless *until* you want to transition to an entire new page/component, say with svelte-spa-router.
You can see it happen here. I click the link for a related video, and you can see the current video has to "fade out", preventing that page from leaving the DOM, so it looks like both pages load at the same time. I'm at a point now where I don't use *any* out transitions.
For all you youngins who never used VHS tapes, Sony Walkmans, a film real, or loaded your video games into your C-64 with a tape, then it's kind of like if someone wrote 1s and 0s on a roll of toilet paper as they rolled it onto another roll, so to read it you have to unroll it.
The tape dominates all concepts of computing. You wrote data and read to tapes. You printed output to rolls of paper on giant typewriters (printers), which is basically a paper tape. There were even paper tapes. Their defining characteristic is they are: LINEAR.
I've been playing different Ark islands to see what I like, but I still can't figure out why people like this game. I get it, you have dinos and it's got a lot to it, but it's incredibly unbalanced almost to the point of being unplayable without excessive cheats. For example:
In playthrough on Aberration I had a Basilisk (ark.fandom.com/wiki/Basilisk) find my base in the *beginner easiest zone* and camp out there. To kill one you need to be about level 100 and have another creature called a Rock Drake (ark.fandom.com/wiki/Rock_Drake) plus Hazmat gear.
I was a little level 20 newbie who had only built a base and tamed one dino, so what the hell kind of game has the most powerful creature in the game killing starting players? I ended up having to use god mode to kill the thing and it still took about 20 minutes at my level.
Alright, some folks have real answers AND these real answers point out the next stupidity of JavaScript NaN. First up "it's an IEEE standard" is not a defense, but here's the one reply for the reasoning:
1. The IEEE standard is *entirely* about Math equality of floating point numbers. There is *NOT* a specification of === since that's not a math thing, that's a JS thing, so they could have fixed it there.
== is IEEE, fine.
=== is what everyone actually needs.
Then:
2. The IEEE standard is about MATH with FLOATING POINT. So then why is a NaN used when you do parseInt() on a string?
Strings are not floating point. Int is not floating point. If the JS people defend with "IEEE standard" this returning NaN in this situation is a vioaltion.
So much of CSS is totally half-assed. I add blur on an image when you hover over it. My box-sizing is border box, yet, when the image is blurred I get this garbage blur overflow on the edge. The solution (2nd image) is to..say "overflow: hidden" (line 66)? What?
How this *should* be implemented is that the blur is contained inside the parent box. The end. If I want the blur to go outside of the parent then I'll put it on *that* component. Nobody in the right mind wants *anything* to bleed outside of boxes accidentally.
But that's CSS all over. Just a half-assed box model that isn't a box model at all, more of a wet-paper-towel model where it seems like the browser devs make a feature and then forget to make it stay inside a box, or forget to make it work inside some random situation.
Remember how I talked about Ark's Scorched Earth being nothing but a death festival? I've been watching various pro-level players play Ark and there's a certain strategy they use:
1. Die often and forget your stuff. 2. Level up movement speed to out run dinos.
It does work.
Scorched Earth for those who don't know is basically a desert world with unrealistic heat properties. You die in about 4 minutes when the temp is 38c (LOL) but live if you get in a tent and make it 37c. Given that 1/2 of the team is from Egypt I find this doubly hilarious.
Unlike other maps you spawn in places and die almost instantly because of the heat, or cold at night, or millions of deadly dinos. You also can't really escape the heat inside a basic thatch structure--the first kind you can build. You just die over and over with no progression.