Ruby website redesigned

4 days ago (ruby-lang.org)

I used cursor over the past three weeks to update a 12 year-old Ruby on rails project. While it has been slightly updated throughout the years, this was my first proper modernization of the code base.

It’s been a real pleasure getting back into Ruby after so many years in typescript, python, and rust.

Happy to see the update. Real shame about the haters here, the Ruby community is a supportive and positive bunch that has shipped real products while others seem to worship at the altar of computer science alone… that’s about as counter snarky as I want to be here

  • I spent ~16 years with Ruby (as a non-primary language for the first 5 years, but then as my primary for the remainder), from ~2006/2007 til 2022/2023. I had a couple of hours free to spin up new personal project this morning. At first I was going to default to Python since I use it heavily at work. On a whim, I decided to see what Ruby 3.4 has to offer since it's been a few years. I am very happy with that decision. I really miss Ruby the language a lot, it's such a joy to work with.

    • Ruby is still a joy for me, too, and Rails continues to evolve while providing solid best practices as the default.

      A side effect is an increased intolerance to agony, boilerplate verbosity, complexity. I look at the JavaScript world and shudder.

      Also, Ruby being as expressive as it is, describing things to an LLM is not really a timesaver over writing the code myself.

So many Web designers put zero thought into how their page looks when it is not loaded or not scrolled exactly past the trigger. So many sites say "0 happy customers", because someone thought showing incrementing numbers is cool. On this page, it opens up with a "100%" loading indicator, for a site that appears to have no interactivity that would require JS, just to show a pointless animation.

  • Yeah, I thought those code samples would run immediately, in which case maybe the loading would be justified (although surely very easy to avoid). Instead, they're links to a different page that has the same code sample and a link to run the code, meaning I need to press twice to see what the code does when it runs, which isn't a lot but is surely at least one (possibly two) clicks more than necessary.

    That said, it's cool seeing some of those samples, because they're honestly not really what I expected. For example, I didn't expect the list subtraction to work at a set operation, so seeing that example gives me a feel for what sort of things I can do with Ruby code.

    • > I need to press twice to see what the code does when it runs, which isn't a lot

      I don't know the exact numbers, but the figures show you lose a high percentage of viewers with each click. So if you have 100 people who view the first page, 10 of them might click the link to the second page, and only 1 of them might click the link to the third page. If having customers view the running code is crucial, you'd want it on the very first page, above the fold.

  • I am sure that the designers had to juggle a massive amount of community input and feedback and I know that this is not easy. Kudos to them for (i) leading with some very apt code examples, (ii) the 4 "whys" and (iii) the multilingual support.

    Speaking from experience (recently we rebuilt https://raku.org), I am sure that they will come back and optimize, but tbh this is not the priority with a new site where the hits will top out at ~ 10k / hour.

    I am no great fan of animations, simpler is better imho - and I have resisted requests to add a sandbox to the Raku site since https://glot.io/new/raku does such a good job anyway... but I think Ruby is likely to appeal to a wider audience via a cool design vibe, whereas Raku is still in the early adopter / geek phase of adoption.

    btw Ruby is a fantastic language!

    • > I am sure that they will come back and optimize, but tbh this is not the priority with a new site where the hits will top out at ~ 10k / hour.

      You don't need to "come back and optimize" if you don't start with needing a progress indicator for a "transform: scale" animation to display a single static download link. The number of hits is not relevant.

      Neither do you need to do three separate fetch requests for static plain text examples that you then laboriously dump into the DOM by creating dummy elements, putting content in there, then looking up and cloning `code` tags to then dump those code tags on the page.

      5 replies →

    • I once tried to try Raku years ago, but I was left really confused by the website and docs.

      Clicking through the code examples on your new website, I kept being amazed at some of the great things Raku does. It's night and day in understanding the uses and purpose of the language! Thank you.

      Unfortunately, as soon as I click into the "introduction" section of the docs I'm abandoned to a wall of links and am once again lost. I'll try persevere this time, but I think you could do adoption of Raku a great favour by working on organising your docs site a bit more clearly. Astro's docs are an amazing case-study on best-in-class docs layout and writing: https://docs.astro.build/en/getting-started/

      1 reply →

    • > Speaking from experience (recently we rebuilt https://raku.org),

      FYI, front-page has a lot of examples, that I assume change when switching tabs, e.g. "multi-paradigm" "strict-gradual" "interactive-mode", etc.

      But nothing happens, neither Safari 18.6, nor Chrome 143.0, on macOS 15.5.

      1 reply →

  • I really like the 90s-esque aesthetic of sites like HN.

    Low bandwidth, minimal in an artistic way.

    I wish less sites would try to make them look like a wordpress from the early twenty aughts.

    • You don't even need to do a certain aesthetic to make your website fast. Just send your entire content in the HTML, instead of needing extra HTTP requests for JS and then more HTML before having all the stuff for your first render.

      1 reply →

    • The early internet aesthetic is why, as much as I dislike the site's culture, I continue to use reddit + RES.

      The UI, the minimal buttons, the tight paddings, the lack of pop-in, the complete lack of animations; these have all been essentially unchanged for the past decade. Even the dark mode colors look exactly as it did the first time I switched it on.

  • Yep, and for such cases it is usually very easy to make it work properly, if only a web developer put a little thought to it. We have most or all of the tools we need in HTML and APIs to make it work regardless. Like for example for the happy customer counter one could easily have a noscript fallback, that uses the number one already needs to retrieve to show the animation, but puts it there immediately. Then, iff JS gets executed, one can still animate the shit out of it.

    It is part of what distinguishes actually good web devs from move fast and break everything kind of people.

I like how it looks. I don't like to see how badly it is crafted tech-wise - not optimized images by size and deferring, JS for things that work natively in the browser, bloat of tailwind instead of nice clean and modern CSS.

Knowing ruby I can tell that the relaxed approach to the website does not correspond with sophistication in the language itself. If I wouldn't know ruby, that would be a put off for me, thinking that if they don't want to convince me tech-wise by their site, it might be similarly annoying to deep-dive into the language.

  • > not optimized images by size and deferring, JS for things that work natively in the browser, bloat of tailwind instead of nice clean and modern CSS.

    care to elaborate?

    • Sure:

      - images: none are visible above the fold - all should be lazy loaded (like it is done with all conference images) and the pragdave.jpeg one does not need to be that large;

      - JS: navigation toggle, including chevron rotation can be done in CSS using :has combined with checkbox/radio input. Similarly for header-navigation and theme-toggle (here combined with cookie store). Then toc.js - seems like something easy to do in the backend. Hero-animation - I haven't looked much through it but seems like at least some parts can be done in CSS;

      - CSS/tailwind - well it would probably take less typing to do it just in CSS, the site does not seem to be that much componentized to benefit from tailwind.

      14 replies →

Not long ago I was looking through programming language sites to figure out how to best introduce the language I'm working on.

ruby-lang.com stood out with a text in a big font:

Ruby is...

Followed by a paragraph about what makes Ruby special. I think that was an exceptionally simple and natural way of introducing something as complex as a programming language.

  • "Programmer's best friend" is precisely the wrong thing to do though (it says nothing and only makes the reader confused. Are we talking about a language or a pet? I'm not looking for a friend.). They took a step back with that.

    For reference this is the old one, which is much better: https://www.ruby-lang.org/images/about/screenshot-ruby-lang-... From: https://www.ruby-lang.org/en/about/website/

    The old one was better because it said something about what the language is and how it benefits the user. "Best friend" is not descriptive. "dynamic language with minimal syntax that is easy to read and write" at least tells me something about Ruby, its priorities, and value proposition. I'm very concerned about a language that claims it wants to be my friend.

    • Dunno, it's a comfy tagline. I never got into Ruby but it always feels to me like it's a really ergonomic and cozy language. Sure, the best friend thing is a stretch, but it's honestly a slogan. How many people land on this page with no knowledge of what Ruby is and will confuse it with an app to make friends?

      1 reply →

I like the new design, however, I strongly believe the website could've been optimized further and used much less JS. Opening the website with JS turned off makes the code examples not load and the front page freezes as "0%" loading.

What does it do exactly? It just fetches[1] to another part of site and retrieves static text[2] to be displayed. This part could've been kept as part of the html, no need for this artificial loading. It's not a webapp, it's a website.

1. https://www.ruby-lang.org/javascripts/try-ruby-examples.js

2. https://www.ruby-lang.org/en/examples/i_love_ruby

In this day and age, it is possible to have an appealing, responsive, lightweight website with no JS (maybe except for darkmode toggle).

Meta, but it's kind of ironic that the main Ruby language website shows a "0%" Ruby symbol with javascript deactivated, and doesn't even show the code examples, which are all just links to some sandbox anyway.

  • It annoys me so much when developers think they can do it better and link with JavaScript. Interactions (like opening a dialog) witj JS - yes. Navigating to sites/positions in-site - that is just dumb. So many pages break the "open in new tab" behaviour with this implementation.

I don't know what others are complaining about here, it loads for me as fast as this HN, but looks nicer.

I thought it would be interesting to try the showcase examples in Raku (since I am always saying how good Raku's imitation of Ruby is)...

  - https://glot.io/snippets/he42jpfm27
  - https://glot.io/snippets/he42trx6w6
  - https://glot.io/snippets/he434b6ryj

Obviously Raku leans more to `{}` and `my $var` than Ruby - but otherwise I think it does a credible job. Obviously these are carefully chosen Ruby snippets to highlit its unique abilities in strings, "array math" and classes. On the string interpolation, I would say that Raku has the slight edge (and has the whole Q-slang for a lot of fine grained control). On the array math, I had to apply the (built in) Raku set diff operator ... so I guess that Ruby is a little more natural for this (rather quirky) feature. On the class stuff, again very close. Raku has much more powerful OO under the hood ... multi-inheritance, role-composition, punning, mixins, MOP, and yet is a delight to use in this lightweight way.

  • For fun, I did the same for OCaml:

    Ex 1

        let say = "I love OCaml"
        let () = print_endline say
    
        (* Requires linking in the 'str' library *)
        let say = Str.replace_first (Str.regexp {|\(.*\)love\(.*\)|}) {|\1*love*\2|} say;;
        let () = print_endline (String.uppercase_ascii say)
    
        let () = ignore |> Seq.init 5 |> Seq.iter (fun () -> print_endline say)
    

    Ex 2

        module StringSet = Set.Make(String)
    
        let cities = StringSet.of_list [
          "London";
          "Oslo";
          "Paris";
          "Amsterdam";
          "Berlin";
        ]
        let visited = StringSet.of_list ["Berlin"; "Oslo"]
    
        (* Requires the 'fmt' library *)
        let string_set fmt v = Fmt.Dump.list Fmt.string fmt (StringSet.to_list v)
    
        let () =
          Format.printf "I still need to visit the following cities: %a\n"
            string_set
            (StringSet.diff cities visited)
    

    Ex 3

      module Greeter : sig
        type t
    
        val make : string -> t
        val salute : t -> unit
      end = struct
        type t = { name : string }
    
        let make name = { name = String.uppercase_ascii name }
        let salute t = Format.printf "Hello %s\n" t.name
      end
    
      let g = Greeter.make "world"
      let () = Greeter.salute g
    

    Obviously, OCaml is a much lower-level language than Ruby or Raku–notably, regex support is not as great, and we have to explicitly tell it how to print values of custom types. Still, I find its lack of syntax sugar makes it easy to read nearly any OCaml code I come across in the wild!

  • Man. Haven’t thought about Raku for a while. Does it have a good web framework these days?

Refreshing and delightful! I know how the home page looks doesn't reflect the programming itself, but this design really makes me want to try Ruby again :)

  • > I know how the home page looks doesn't reflect the programming itself

    It does reflect what the language creators pay attention to. Way back when, when I was undecided between learning Python or Ruby, after visiting countless resources I noticed Ruby websites in general looked way nicer and clearer than Python websites, so I picked Ruby. Now, years of experience with both languages later, I have zero doubt that to me that was the right choice at the time. I would’ve been frustrated with Python to no end.

    I no longer need either language regularly, but given the choice again I would not hesitate to go for Ruby.

    All that said, I do agree with some other comments on the thread regarding the disappointing reliance on JavaScript here. Should just be static.

I wonder why Sandi Metz is missing in the testimonial section. One of the most influential persons in software analysis and design in the Rubyverse.

  • Sandi is also "moderately retired" -- hasn't done a speaking engagement in 5 years -- a blog post in longer...

    Sometimes it's nice to just let people rest and get on with life.

  • Had the same exact thought. That DHH was included and Sandy was not really surprised me.

    • DHH is the lead developer of the most popular ruby web framework, Sandy is the author of a mildly popular book. Not knocking her work, but DHH is magnitudes more influential.

    • I think dhh's quote just isn't very good -- of course someone who has so much identity invested in the ecosystem is going to say "I looked around and still nothing is better than ruby!" Well maybe not even of course, not even every "BDL" is as cringingly self-promotional as dhh, some have a bit of humility.

      i agree it's not a great look.

      Hopefully the website will keep getting regularly updated and tweaked (software, is a living organism!), instead of being frozen in amber for a decade like the last version!

      3 replies →

So, in order to show a single download link it needs to load an animation with visible loading progress even on a gigabit connection. It takes a few seconds to appear. All to show a scaling animation that can be achieved with a couple of lines of CSS.

Same for absolutely static code examples that take a few seconds to load and shift the content away.

Why?

  • You are a rare species, on the verge of extinction.

    Unfortunately, most people today probably don't care about what you're talking about. (I do, but I've decided not to comment on it anymore, because it would probably drive me crazy :)

wow that loads slow

I like the design and content. Being able to immediately try a language online is huge

But there has to be a way to load that content in a progressive manner. Loading a static version first and then hydrating the content if you need interactive actions

Nice! There is a Japanese feel to the lead graphic, their prevalence of cartoon imagery, that one might not recognize without having traveled in Japan.

Is the design debate public? I'd imagine it would make great reading.

Is there a manifesto out there saying that one should build with html and only if needed add css then svg then js?

It seems this site doesn't work so well without JS.

  • I think this is the first time I've seen a website where the download button, which is just a link, requires JavaScript to render.

The site looks great visually but the technical implementation is disappointing. Here's what's wrong:

1. Code examples are fetched via JS instead of being in the HTML. They're static text - there's zero reason for this.

2. The "0%" loading spinner blocks everything. It's literally just displaying a download button and some text.

3. With JS disabled, you get nothing. A language website should be the poster child for progressive enhancement.

The irony is that Ruby itself has always emphasized developer happiness and doing things "the right way." This site feels like it was built with the modern JS framework mindset rather than the Ruby philosophy.

Still, huge improvement over the 2005-era design. Just wish they'd optimized it properly.

I don't get the people who complain about the website not working with disabled js. Maybe I miss something and a large part of users disable / have js disabled in their browsers for some reason? Why the target audience of the ruby, probably primary web developers, whould do that? Or is this a some kind of secret handshake so community accept you (to build a website that can work with no js)?

  • Back in the 2000s in the web standards development community there were multiple web development strategies called "progressive enhancement", "graceful degradation" and "unobtrusive javascript":

    https://en.wikipedia.org/wiki/Progressive_enhancement

    There were a lot of practical reasons for that: The browser landscape was much more diverse, different browsers had different support of standard Javascript, some browsers didn't even support JS and some people still kept text-only browsers like lynx/links in mind. Also browsers were not evergreen, so a large part of the audience could be on some older versions. Another thing were sometimes brittle network connection, especially over mobile. Depending on JS could in the case of corruption mean non-functioning websites.

    For a lot whose exposure to web development and the discussions abound that, that reason will be stuck in their head, even if in the last decade of React ets the "best practices" will have changed.

    There is also an aesthetic thing: There is a thing of beauty in simply curling an url and piping it into grep or such to get the thing you need, instead of having so have an headless browser. In my mind that is still how the web should work.

  • It's become a bit of a shibboleth to have js disabled, and brag loudly about how that breaks much of the Internet. It's a weird form of nerd signaling

  • It's a common philosophy for developers with standards of robustness and accessibility to not hard depend on js for things that don't need js to function.

    > Why the target audience of the ruby, probably primary web developers, whould do that?

    In my experience, it's mostly web developers who care about this in the first place.

    • > mostly web developers who care about this in the first place.

      I’m not sure what you mean by this. We care about our users and how they use our websites. JavaScript is everywhere and has been the de facto frontend standard for the past few years. Supporting no-JS is starting to feel like supporting a new browser. As much as I’d like to, from a business and product point of view, the numbers are just too small for us to even consider it.

      1 reply →

    • I can understand the aspiration to have the system that can be run from the lowest level out of box tools, but then, I am doing frontend for almost a decade and this is porbably the first time I'm seeing such attention to this specific 'no js' use case, as in this thread.

      Maybe I'm not reading enough webdev forums. I agree though that things that don't required js should be written in no js way.

Very form over function, with JS for everything, including static content, and bad performance. This signifies what’s wrong with “modern” webdev.

So much better. The website was looking like abandonware, which was not helpful in projecting ruby as an actual thriving ecosystem.

It looks great, but it's missing the one thing I want most in the site - the ability to select the version of the language documentation in some way other than editing the URL directly. I use ruby-lang almost exclusively for the documentation.

I also wish the documentation search parameter were saved in the URL. This would allow people to create a custom Chrome search engine like @ruby and dramatically speed up doc searching.

The Lighthouse report is telling. It scores 100% for Best practices and SEO, but 54% for Performance. Pages like these used to be caricatures of the modern web, but are now acceptable. DHH's statement doesn't help either.

  • I dreaded the thought of scrolling down because I knew I’m gonna stumble upon his face.

    • the only thing his statement was missing was thank you for your attention to this matter

  • Honestly, the synthetic Lighthouse tests would be great but for the fact that they're using Google Fonts. It's like the only major thing in their critical path.

Ruby is GOATED. You can say what you want but Ruby coupled with Rails is the most productive web stack period.

Why you might ask? - Omakase Stack - high level is good for business processes - modern concepts without JS ecosystem churn - great testing capabilities - great ecosystem - highly effective stack for LLMs (conventions)

Is it fast in Benchmark Games - not by any means. Will you be able to finish projects and make money with it? Absolutely.

I find this distasteful:

  cities  = %w[ London
              Oslo
              Paris
              Amsterdam
              Berlin ]

Do it properly with quotes you lazy people :)

EDIT: typical ruby (on rails) code: saves a few characters, breaks readily (Hint: consider "New Orleans")

The number of times Matz is mentioned and depicted on the homepage is offputting. MINASWAN feels too close to WWJD for me. I can't think of another programming language community that does this, and I'm including Wolfram in that assessment.

  • In C++ we just constantly bash the committee for its bad decisions and pretend we would've done better than Stroustrup.

    Seems like a more grounded and healthier approach to programming languages.

Very nice, my nature-lang references the old ruby design, now maybe I can reference the new one.

Haven’t seen a loading progress spinner on a landing page in a while. The Ruby website now loads almost as slowly as Ruby on Rails boots up.

Well well well. Now can we stop arguing about ruby death? It is even got a site redesign! What a fresh look. Previous design was from 2005?

The visual refresh is great, but the technical implementation is disappointing. Code examples are static text fetched via JavaScript instead of being in the HTML. With JS disabled, you get a frozen "0%" loading screen.

This is ironic because Ruby has always emphasized doing things "the right way" and developer happiness. A language website should be a poster child for progressive enhancement - especially one that champions elegance and proper practices.

Still, huge improvement over the 2005-era design. Just needs optimization work to align the implementation with Ruby's philosophy.

I loved the old website. It was one of the few "good old things" I used to check out when I got nostalgic. What a waste...

Lol, it does not load when JavaScript is disables. I wonder if Ruby still sticks to Free Software principles.

Bad branding community wise to quote DHH on the frontpage. Will immediately turn away many. He isn’t worth wasting the reputational loss that comes with printing his words.

  • I'm outta the loop; what did DHH do or say to invite the wrath of the Kraken?

    • He acknowledges that mass importing Muslims into the UK is killing the country.

      For some reason there’s a large swath of people who really don’t like people saying that.

      1 reply →

On my iPad, without scrolling, the screen shows almost nothing, just a download button and some text that, I think users will ignore. I think that’s a waste of valuable screen estate.

Also, apart from a quote from David Heinemeier Hansson the home page doesn’t even mention that ruby is a programming language.

For comparison, the following all mention that above the fold, with a short phrase indicating what you would want to use the language.

- https://www.python.org/ has “Python is a programming language that lets you work quickly and integrate systems more effectively. Learn More”

- https://www.perl.org/ has “Perl is a highly capable, feature-rich programming language with over 37 years of development”

- https://www.php.net/ has “A popular general-purpose scripting language that is especially suited to web development. Fast, flexible and pragmatic, PHP powers everything from your blog to the most popular websites in the world.”

- https://www.swift.org/ has “Swift is the powerful, flexible, multiplatform programming language. Fast. Expressive. Safe.”

  • Funny how these statements seem to preempt alternative descriptions, misconceptions or criticisms.

    Python is pretty well known as a data, analytic and machine learning oriented language, and they lean into a more broad characterization.

    Perl might be described as dead/dying, and they characterize its development as ongoing.

    PHP might be described as a web scripting language, and they characterize it as general purpose and broad.

    Swift might be described as an Apple platform a language, and they really want us to know its multi-platform.

    • That’s not funny; it’s good use of the most prominent part of the site.

      A site (re)design starts with determining who’s your audience, and what you want to tell them.

      These sites will want to serve both existing and new developers.

      What they want to tell them will be different for the two groups, but the existing ones won’t be chased away by a short description aimed at newcomers, but newcomers can easily turn away by the lack of such a description.

      As to what to put in the description: it sort-of is an advert, so you often don’t exactly say what you are, but more what you want to be.

      https://www.swift.org is a clear example. They definitely want to tell everybody that Swift is multiplatform, giving cloud services, command line tools and embedded development more prominence than iOS apps.

      I think they do that particularly well, much better than this ruby site (https://www.ruby-lang.org/en/)

      For example, on the swift site, they claim ‘embedded’. If you click on that, you get examples for various platforms such as Raspberry Pi and STM32 (https://www.swift.org/get-started/embedded/). That allows you to verify that claim.

      In contrast, this Ruby site makes claims such as 'Easy to write, easy to read. Natural syntax like spoken language’, 'Do more with less code', but it’s not easy for users to check whether that’s true.

[flagged]

  • > somehow, the Ruby community [...] think it's acceptable to have a standard implementation that does neither AOT nor JIT native code compilation

    Ruby have YJIT, which is a production ready JIT compiler that generates native machine code. But it requires enabling via flag "--yjit" rather than running by default.

    Why? I think it's primarily to avoid build time dependencies on Rust and prevent unexpected overhead for users. This keeps binary light and avoids forcing Rust installation on users, especially for those who run interpreter only, where YJIT adds no value.

    Note that including YJIT also bloat binaries by 5 to 10MB (Rust static lib + code cache structures) for source builds and complicates cross compilation since Rust targets vary by architecture (focus x86-64 and arm64, not all platforms).

    Also, Rails 7.1+ enables YJIT by default, so JIT (to native code) in Ruby is being utilized when actually needed.

  • Do you often rant like this based on completely incorrect info? Could save yourself some time and downvotes by doing basic research first.

  • Ruby has had YJIT for some time and being deployed and used in production, from Github to Shopify.

    The current experimental JIT is ZJIT. And the fastest Ruby JIT Runtime is TruffleRuby. ( I wish JRuby gets more love )

This is just straight-up unappealing, really gaudy, if that's the right word. Otherwise I can't put it into words well.

I really wanted to like Ruby, but the ecosystem is just... broken.

Comparing to Python, where virtualenv is de facto default, and pyls works by default, the experience with Ruby is not that great.

New website looks like a website for a startup project that will be closed in 2 years.

  • What is broken in your mind? What things did you have a "not that great" experience with? There are de facto standards and defaults in Ruby as well.