amitp

I think about this a lot. My site is now 28 years old [1], older than wikipedia or google or even slashdot. People still read the gamedev pages, and I still update them. Coincidentally, I was just writing some notes on this topic last week [2].

1. Hosting. I was lucky in that Stanford gave me a place to put pages. I think it was more common back then for universities to do this. Now I have a domain name which I register for 10 years at a time. But that's not going to last 30 years after I pass away. And even if I had the domain name, my server (currently AWS) won't stay up if I don't pay the monthly bills. My Stanford pages will stay up longer than my RedBlobGames pages.

2. Compatibility. Use tech that's been around for a long time. Static HTML is best. JPG or GIF, not WebP etc. My older pages don't use Javascript but my newer pages do, and they do require occasional maintenance. I've also had to update things to make my pages work with mobile and HTTPS.

3. Dependencies. Don't link to external resources like fonts, scripts, images, etc. Everything should be on the same site, because you don't know that other sites will stick around.

4. Archivability. Test the pages on Internet Archive to make sure they work there. Most of mine do. A few of mine don't, and I'm working to fix that. I think once your domain name expires, it's the archives that will have the only copies, so you want to make sure your pages can be mirrored/archived.

In addition to the "30 years after the author passes away" problem, I also want to update my pages over time. For example, in August I updated a page that I had written in 1997. I try to minimize external build dependencies. The common build tools in use today are unlikely to still work long into the future. I have some of my own build scripts that I can keep working. For longevity I use "old" tech as much as possible (bash, python) and stay away from nicer newer languages and tools.

[1] http://www-cs-students.stanford.edu/~amitp/ [2] https://www.redblobgames.com/making-of/little-things/#site

I had a problem with the combination of Google Meet, my bluetooth headphones (Aftershokz), and Mac OS Monterey. It would keep beeping and putting it on hold. https://chrome.google.com/webstore/detail/disable-automatic-... was the workaround for me, and also in Zoom I disabled "automatically adjust microphone volume". Frustrating.

I have a separate problem where if my computer goes to sleep or goes out of range, the headphones keep beeping until I turn them off. :-/ But this seems specific to the one I'm using and hasn't happened with my others.

Vue's is especially nice in that it handles deep and imperative updates.

For example: you have an observable foo, and it has an array bar. You can read foo.bar directly instead of needing a wrapper getter function. You can also update foo.bar = … instead of needing a setter function. You can also call foo.bar.sort() and Vue will pick this up.

I see lots of small reactive libraries but a lot of them will not pick up something like foo.bar.sort().

I've been helping test https://gasgame.net/ . It's pretty early in development and somewhat unpolished, but it seems you haven't gotten many replies here. Desktop, multiplayer, no mobile support, top-down tank combat game. Wouldn't say thrilling though. No login needed but you can create an account if you want to save your progress. (I really don't like a browser game to require an account before I even try it!)

Take a look at what they've done. The basic idea is that the video is "on rails", moving forward on its own, but at any point you can pause and move around the objects from the video. Then you can go back to the video and it interpolates back to the recorded track. I loved what they did, but it didn't help me understand quaternions ;(

I think that's a good shortcut. Converting from axis-angle to quaternions is similar to switching from an angle to a vector (cos angle, sin angle). However I didn't really grok quaternions until looking at geometric algebra, and I haven't used them since then so I can't be sure my intuition is right.

Corfu might be worth a look, as a lighter weight alternative to company mode: https://kristofferbalintona.me/posts/corfu-kind-icon-and-cor...

Interesting! I've wondered about that. (Also: hi again! we seem to have so many shared interests over the decades — bbs, usenet, gamedev, c2 wiki, programming languages — that we should meet up someday)

BTW the accused reporter is an occasional HN user who maintains a blog[1] and wiki[2] about BBS software. He started that site after seeing that Wikipedia was deleting pages about BBS software[3].

[1] https://breakintochat.com/blog/

[2] https://breakintochat.com/wiki/

[3] Jason Scott's blog post http://ascii.textfiles.com/archives/3826

Screeps is fascinating but I never got motivated to play it. :(

I use the Stanford pages [1] to link to interesting papers and I use Red Blob Games to explore interactive ways of presenting topics. The most recent update to the Stanford pages is from 3 weeks ago, about any-angle pathfinding [2]. But most of what I do these days is on the Red Blob Games site. I probably would've kept using the Stanford pages but they have a 100MB quota limit and I was running out of space…

[1] http://www-cs-students.stanford.edu/~amitp/gameprog.html may be the oldest surviving game development website, as I started it in either 1994 or 1995. Older than Google or Wikipedia or even Slashdot. [2] http://theory.stanford.edu/~amitp/GameProgramming/Variations...

Thank you!

I was amazed by how bright this page could get, on both Macbook and iPhone — https://kidi.ng/wanna-see-a-whiter-white/ — and I want to figure out how to use this superwhite on my interactive tutorials. But as far as I can see, canvas, svg, and webgl can't access it.

That's more than most of my blog posts :-) Blogger says I have "20 followers" but some people subscribe via RSS. I would normally get ~50 views and ~0 comments.

It is similar in topic but not written in reaction to. I had written the post almost a year ago and posted it a few days ago.

I'm using Comic Mono in my terminal and Iosevka in my editor but your comment reminded me that I can pick and choose individual characters — look at all the drop-down boxes on section 02 of https://typeof.net/Iosevka/customizer — so I shall do that. Thank you!

That's more of an intermediate level; I think https://www.redblobgames.com/maps/terrain-from-noise/ is a simpler place to get started. For concepts ("frequency", "octaves", etc.), see https://www.redblobgames.com/articles/noise/introduction.htm... but I would recommend starting with the practical page and then reading the theory page afterwards.

Also, there's a procedural generation reddit (https://old.reddit.com/r/proceduralgeneration/) which has resources in the sidebar and there's also a procedural generation discord https://discord.gg/67yD223

Yes. I used "savings" in the title and first paragraph for SEO reasons. This blog post is from 2006, when google didn't change words into other words without asking, so it was useful to use the variant that people search for rather than the version that is correct.

Same here — Hammurabi and King were what got me started writing games. I learned so much from experimenting with that core loop, and it got met interested in math, economics, and lots of other subjects. Fur Trader, Civil War, and Combat also.

This looks beautiful!

For a "cannot unsee" demo of Simplex Noise in 2d, see the animation on the first row [1]. Simplex Noise is a light/dark pattern in each hexagon.

[1]: https://www.redblobgames.com/x/2107-webgl-noise/webgl-noise/...

I agree. I've put a lot of work into building these types of visualizations (Red Blob Games) and I've been able to come up with useful visualizations for only some of the problems I work on, and for a small subset of the data structures. For example, with my A* pages I purposefully chose graphs that are planar and have at most a few hundred nodes, because that works well for the visualization. But if you were to ask me to make my A* visualizations work for any graph, including non-planar or millions of nodes, I wouldn't know how. I know some people want general purpose tools "for practioners" but I don't know how to get there, and years of making these visualizations has not gotten me any closer! :-( Maybe someone will come along and figure out a generalization, but I don't think it will be me. I think the "trailing wheels" style pages are a subset that clearly benefits from visualizations, so I'll focus on those.

Yes, xor can be used as part of this — see the paper[1] and code[2]. The idea is that you're generating a random shuffle of a sequence, but you can do it in a way that doesn't require storing the entire shuffled sequence. You can ask "what's in position 4" and it will return "item 1".

[1]: http://pcgworkshop.com/archive/mawhorter2019anarchy.pdf [2]: https://github.com/solsword/anarchy

My life is also in Emacs. I'm using it all the time on the new Macbooks and it's working great for me (gui mode, not terminal mode).

There are two major versions of Emacs on Mac. There's the "NextStep" version, which is part of the official emacs repository, and the "Mac" version, which is separately maintained.

* emacsformacosx.com runs in x86 emulation mode, but flickers when using lsp mode --> this is the version the author used, and I didn't find it to work well. It's the NextStep version.

* Mitsuharu Yamamoto's maintains the Mac port and has M1 patches in the "work" branch but not in the master branch. I use the work branch and am very happy with it. Compilation instructions: https://amitp.blogspot.com/2020/11/building-emacs-27-on-appl...

* in homebrew the emacs and emacs-plus packages both work on arm m1, but I haven't tried these as I prefer the Mac port over the NextStep version.

* homebrew "railwaycat" emacs is based on the Mac port, and it looks like it has m1 patches, but I haven't tried it either.

* The gccemacs branch was tricky to get working even on my x86 mac, and I haven't tried it on the M1 macbook. It requires libgccjit which is in x86 homebrew but not in arm homebrew (gcc is not yet available). The M1 feels so fast that I've not felt the need to use gccemacs.

TL;DR: Emacs is not a blocker, but the widely used version from emacsformacosx.com doesn't work as well as the Mac Port [https://bitbucket.org/mituharu/emacs-mac/src/work/README-mac]

https://gtoolkit.com/ looks different from most IDEs I've seen, but I haven't tried it yet.

Also in nature: there is a giant hexagon on Saturn! http://www-cs-students.stanford.edu/~amitp/diagrams/saturn-h...

Yes, old school web! A few of the others I like: https://faculty.evansville.edu/ck6/tcenters/ ; http://paulbourke.net/ ; https://pomax.github.io/bezierinfo/ ; https://www.fieggen.com/shoelace/ ; https://www.wood-database.com/ ; http://www.oftenpaper.net/sierpinski.htm ; https://www.animatedknots.com/ . There are lots more out there but social media favors new content rather than timeless content.

I want to see more pages like that so, following “Be the change that you wish to see in the world”, I am writing informational pages.

Hexagons are bestagons!

A surprise to be on HN!

Tech notes for the curious:

I started the page in 2013 based on notes I had been collecting for ~20 years before that. I update this reference page as I come up with better visualizations and explanations. The last major update was in 2018 when I rewrote it from using d3.js to using vue.js. It greatly reduced the amount of code I was writing, and also let me make the page more interactive. I then added lots more (doubled coordinates, links to papers, axes legends, diagonal directions, side by side comparisons) and improved most of the existing sections. In 2019 the changes were minor, rewriting the map storage section and improving performance. In 2020 I improved the cube/hex animation, the pixel-to-hex section, and added Rust sample code. There's lots more I could add to the page[1] but I don't have any specific plans for when I'll get around to it.

The page is svg- and js-heavy. I prerender the diagrams on the server (try loading it without js!). Then using IntersectionObserver on each section of the page, I swap the static diagrams and text with interactive versions. This improves load times somewhat, because almost no JS has to run on page load.

For printability I process the page with xsltproc, extract all the links, and turn them into footnotes. Try print preview on the page to see these. Unfortunately the diagrams are broken when printing in Chrome (it works in Firefox) so I need to investigate.

[1]: https://www.notion.so/redblobgames/f8bc2f44fba94607afa9c0671...

I use this approach too but it fails whenever there's any state in the elements. An example is input elements:

  function update() {
    let value =   document.querySelector("input")?.valueAsNumber;
    document.querySelector("main").innerHTML = `
    Enter a price: <input type="number" oninput="update()"> 
    <br>
    Discounted price is ${value * 0.8}
    `;
  }
  update();

What will happen is each time you enter a character, it will create a new input element, which loses the focus and cursor position.

To solve this we can split it up so that the inputs are created once and the output is updated with innerHTML. No problem, right? But it's hard to scale up because now you have to split the html up into small segments based on whether there's internal state or not. If you want to update the 'max' of an input type=range, you aren't doing it with handlebars anymore but you have to use setAttribute instead.

What react, vue, etc. do for you is handle the updates in a way that reuses the existing elements. If you changed any attributes of the <input type=number>, it will not lose the focus and cursor and any other state. If you change the max of an <input type=range>, it will update the existing element (using setAttribute) without losing any other state. If you change some text, it will update the existing text node using innerText/textContent.

You may not need this type of system. I think React, Vue, etc. are overused. But in some projects it's much cleaner to use a React/Vue/etc. style system rather than splitting it up where some segments use setAttribute, some use innerHtml, etc.

The migration guide [1] lists breaking changes. If you use many Vue 2 libraries you'll want to wait until they're updated to Vue 3. (I reminds me of the Python situation where if you used lots of Python 2 libraries you'd write your new code in Python 2 instead of Python 3, until those libraries migrated to Python 3)

[1]: https://v3.vuejs.org/guide/migration/introduction.html#break...