19 votes

Behind the curtain: Tildes architecture

Was there ever a write-up on why Tildes was architected the way it was? For example, why Pyramid instead of the usual suspects like Django or Flask? I'd be curious to read the reasoning from the developer(s) themselves.

3 comments

  1. [3]
    creesch
    Link
    Yes, in fact it is all documented :) you can find it all in the footer below but for your convience: Site Implementation Docs link Site design Docs link

    Yes, in fact it is all documented :) you can find it all in the footer below but for your convience:

    Site Implementation

    Docs link

    General

    Open-source as much as possible

    Similar to the "privacy by default" principle that comes from Privacy by Design, my goal is "open-source by default". That is, the default state of all code for Tildes should be open-source. There should need to be a strong justification to not open-source something.

    License

    Tildes is licensed under AGPLv3. My reasoning for this is that it seems to be the only established license that will ensure the code (and anything built on top of it) will always remain open-source.

    This isn't because I believe that Tildes's code is valuable or to prevent it from being "stolen". It's intended as a commitment, similar in many ways to organizing as a non-profit. It means that anyone that contributes code to Tildes can do so knowing that it can never be closed off, for profit, or any other reason.

    I recognize that there are many companies that consider AGPL-licensed code too risky to use, but I don't think that's much of a concern for a project like Tildes. I think that would be an important consideration when choosing a license for something like a library, but it's not very relevant for a service that will probably not be widely re-used.

    Use modern versions of simple, reliable, "boring" technology

    There should need to be an extremely compelling reason to use a new or less-known technology to implement something if it could also be done with one of the reliable ones already being used.

    This will, also, make it easier for people to understand and contribute to the open-source code when there are fewer pieces involved and the ones being used are generally well-known and well-documented.

    Here are some of the main technologies being used on Tildes:

    More info:

    Keep the site lightweight

    The average file size and "weight" of web sites has become a bit ridiculous. In April 2016, it was pointed out that the average page was now larger than the game DOOM. About a year later, Dan Luu did some testing and went into this in more depth after noticing that the majority of popular sites on the web wouldn't even load on a slow/unreliable connection. Since he wrote that article, page weight has grown by another 20%.

    More info:

    Code quality is a priority

    Especially as an open-source project that wants contributions, it's important to ensure that Tildes's code is generally high-quality, easy to understand and modify. Similar to deliberately choosing simple technology, code should also be written simply whenever possible.

    The quality of Tildes's code is kept up through code review and enforcing strict code style (by using Black) and commenting standards, as well as additional tools like mypy to require that all functions use Python's new type-annotation system.

    More info:

    The site is the main mobile interface, not an app

    Tildes is a website. Your phone already has an app for using it—it's your browser.

    Tildes will have a full-featured API, so I definitely don't want to discourage mobile apps overall, but the primary interface for using the site on mobile should remain as the website. That means that mobile users will get access to updates at exactly the same time as desktop ones, and full functionality should always be available on both.

    No limits to logged-out browsing

    Tildes won't have limits or roadblocks to browsing the site without logging in. Sites that do that are usually "growth hacking"—trying to boost their user numbers by using tricks to force people to register even if they don't really want to. Since Tildes does not care about growth, there's no reason to do this.

    In fact, from a technical perspective it's far easier if more users are logged-out. It's often possible to serve all logged-out users the same static copy of a page, which is very lightweight to do.

    Minimal javascript - don't "flip the web pyramid"

    There's a "pyramid" concept that's been used for many years when people talk about building for the web. It usually shows a solid base of HTML, a layer of CSS, and then the tip of the pyramid is javascript. I saw one most recently in Charlie Owen's great talk Dear Developer, The Web Isn't About You, where she refers to it as The Pyramid of Robustness.

    The idea is that the essential part of a site should also be the most reliable—the HTML. The "higher" layers are still important for adding design and interactivity, but the site shouldn't completely fall over without them, because they might fail or not be applied for various reasons.

    However, modern web development has basically flipped this pyramid upside-down. It's become standard for client-side javascript to deliver—and even generate—the HTML and CSS. Many basic, text-based sites (like blogs) no longer display anything without javascript.

    I believe that relying on javascript to this level is fundamentally the wrong approach to the web, so Tildes is built in the "traditional" manner. Javascript is used as minimally as possible, and ideally only when it's the only option for accomplishing something. And because of that...

    Completely functional for browsing without javascript

    Tildes will always be functional to browse without javascript enabled. Someone with javascript disabled should be able to look through all the listings on the site, read all types of posts, and so on.

    It won't be a priority to make interaction work without javascript. Some features may end up naturally working due to how they're implemented, but I'm not going to worry about making things, like voting, functional when javascript is disabled.

    Privacy

    Zero third-party scripts/assets during normal use

    Currently, the only page that includes any third-party assets at all is the one that redirects to a Stripe Checkout page when making a donation. This may be required again for some other donation methods or other very specialized uses, but in general there shouldn't be any third-party scripts or assets used on the site.

    This means that when people are using Tildes, their device is communicating only with Tildes servers, not other companies that are tracking and collecting their data.

    Security

    Full HTTPS/SSL

    Tildes has been built to be used 100% over HTTPS. It has an A+ from the SSL Labs test, and uses HTTP Strict Transport Security (HSTS) to ensure it's always accessed securely, including being on the HSTS preload list.

    Restrictive Content Security Policy (CSP)

    Tildes utilizes an extremely restrictive Content Security Policy to eliminate the possibility of cross-site scripting (XSS) and various other web exploits.

    XSS attacks, generally, happen if a malicious user discovers a way to get a <script> tag onto the site (usually by finding a loophole in how user-submitted text is processed). With the restrictive CSP used on Tildes, even if someone does discover a hole and manages to inject a script, the CSP will prevent it from having any effect.

    The CSP on Tildes is quite close to the most restrictive one possible (while still allowing the site to use self-hosted scripts, images, etc.), and gets a perfect score on Mozilla's Observatory test.

    Site design

    Docs link

    The "Tildes" name

    On Tildes, the tilde symbol (~) is used to mark sections of the site: ~music, ~games, ~tv, and so on.

    The path that led to "Tildes" was a bit strange. Originally, I wanted to have a name related to the word "spectrum". I think that's a great term for describing an online community platform: a wide range of variance inside a whole. That's why the non-profit behind the site is named "Spectria".

    As part of thinking about other topics related to a spectrum, I ended up on waves and waveforms, which led to realizing that the tilde symbol (~) looks like a tiny wave. For multiple reasons, I started really liking the idea of using a tilde as the "marker" for a community on the site (for example, the music community would be "~music").

    First, tilde is one of the only "unreserved" characters that can be used in web addresses (URIs). From the RFC related to URIs:

    Characters that are allowed in a URI but do not have a reserved purpose are called unreserved. These include uppercase and lowercase letters, decimal digits, hyphen, period, underscore, and tilde.

    That means that a tilde can always be used in a web address without needing to be escaped or converted. This isn't true for many other symbols; for example, some sites try to put an @ character in their addresses (usually related to usernames), but since that's not an unreserved character, it will often get converted to %40, which looks much uglier. A tilde should always be kept as a tilde.

    In addition, the ~ symbol also has an association of "home" to many technical people. If you're using the Bash shell (or various others), a tilde can often be used to refer to the user's home location. For example, the command cd ~ changes the directory to your home directory. A command like cd ~deimos will go to the home directory of the user deimos, and so on. I like the idea of each community being thought of as "the home for <topic>".

    It's also a bit of a throwback to common addresses on the early web, where users would host their website on a shared system under their username. For example, when I was in university, the address of my website hosted on the Computer Science department's server was something like http://pages.cpsc.ucalgary.ca/~cbirch. Paul Ford caused a fun resurgence of this a few years ago when he started Tilde.Club.

    So in the end, a bunch of technical, historical, and associational reasons convinced me that I definitely wanted to use the tilde symbol. From there, it didn't take much until the symbol of the site turned into the actual name.

    A name for Tildes users

    There's no official demonym, and the majority apparently doesn't want one.

    Despite @Kat’s insidious attempt to influence the data, “waves” as a demonym only received 5.5% of the vote. The leader for that, overwhelmingly, is “no demonym at all”, with a combined 49% of the votes and 18.5% of respondents strongly preferring the site not to have a demonym. Second place, the generic “users”, only has 15.8% in comparison. The first Tildes-specific demonym present is Tilders/~​rs, with 13.4%.

    The (unofficial) year 0.5 demographics survey

    The Golden Rule

    There are many variants of the "golden rule", but the base idea is that you should act towards others as you'd like them to act towards you. That philosophy applies to various aspects of how I'm approaching building Tildes: in the end, I'm trying to build the community site that I wish existed, one that treats its users the way they want to be treated.

    For example, having low tolerance for people that consistently make others' experience worse. Nobody (except trolls) hopes to get abuse in response to their posts, so there's no reason to allow that kind of behavior. If people treat each other in good faith and apply charitable interpretations, everyone's experience improves.

    This sort of approach can also apply to decisions related to site mechanics and features. For example, when a feature has a privacy implication, we should consider how we would want our own data to be treated. If the idea of another site collecting similar data would make us nervous, we should try to figure out a way to adjust the feature to reduce or remove that anxiety.

    Use words, not icons

    It's become widespread in web and app design lately to use icons extensively, often with no accompanying text label. This can make understanding an interface quite difficult: a lot of icons are unintuitive or opaque, and it's not uncommon for different sites to use the same icon for different functions (or different icons for the same functions).

    On a PC, the user might need to mouse over a bunch of different icons to figure out what they're supposed to mean. On mobile, this usually isn't even possible and the user just has to try pushing buttons to see what happens. The result is that a lot of users won't even realize that some functionality exists, because they weren't able to puzzle out the meaning of an icon or didn't want to click random buttons to see the result.

    On Tildes I'm leaning towards using words to label information and functions. That makes it far easier to look at a page and figure out what it's possible to do.

    More info:

    Tildes and non-English languages

    For now, Tildes supports only one language: English. Many of the site's goals will be difficult or impossible to work towards without being able to understand what's going on in a community, so for now everything needs to be primarily in English. This may change someday in the future, and if it does, the hierarchical groups could work very well for giving other languages their own set of groups.

    The comment box

    The comment box is placed at the bottom of the page to promote reading all — even very new — comments before posting a new one.

    As mentioned, we've talked about this multiple times, and it's probably the most common request for change I've heard so far—I think most people think it's a mistake that it's at the bottom, not something I did deliberately. People have already linked you to some of the other discussions about it, so let me cover something new this time that I've come to realize about why I like having it at the bottom.

    Of course, I think it's a good thing that it encourages people to read the existing comments before posting their own, but there's also a more subtle side effect to this: it encourages responding to other people over posting your own top-level comment. While you're reading the comments on your way down, it's more likely that you'll consider replying to someone else. Maybe you'll end up saying basically the same thing that your top-level comment would have, but now you're doing it by discussing with someone else, instead of just throwing your thoughts out (and hoping that other people start discussing with you).

    Also, yes, this gets more and more inconvenient as the thread gets larger, but I think that's also a good thing in some ways. I think most of us that have a lot of reddit experience have learned that once a thread gets to a certain size, a new top-level comment has very little chance of being seen by more than a tiny group of users. If we're coming into a large thread with hundreds of comments, we know that if we want any chance of our comment being seen at all, you pretty much have to reply to one of the chains that's already near the top. This situation isn't really great overall, but I think it's even worse because the comment box being at the top encourages people to post new top-level comments, which will probably feel discouraging when they end up getting no responses or even votes.

    One thing that I think is good to keep in mind too is that all threads don't have to behave the same, and maybe we can eventually have some different thread "types". For example, the introductions thread is one where people definitely should be encouraged to post new top-level comments (and the thread should probably also be sorted so the newest comments come first by default). So maybe in the future we could have a separate thread type that sorts by new by default and also moves the comment box to the top, since it's more appropriate in that type of thread.

    Deimos

    Lack of downvoting

    Tildes does not have negative votes for either topics or comments. The reason for this is that I believe we can implement different mechanics that replace the "proper" use of downvotes without also enabling all the misuses of them.

    The ideal usage of a downvote is a generic way to express "this doesn't contribute", but in practice they tend to be used more as "I disagree" or "I don't like this". High-quality posts will often get downvoted because other users disagree with the opinion, and in taste-based communities (such as ones related to music), entire categories of valid posts might not be viable because they'll just be downvoted by users with different tastes.

    On Tildes, I want to find ways to accomplish those valuable uses through other mechanics. For example, the comment labels can be used to communicate why you don't think a comment contributes. Topic tags will allow users to simply filter out certain types of posts that they're not interested in, instead of downvoting them and hurting them for other users that do want to see them.

    No warrant canary on Tildes

    It's an interesting question, and I honestly haven't researched warrant canaries very heavily, but my general feeling towards them is a bit negative because I don't think they're very useful.
    A few concerns/problems I have with warrant canaries in general:

    • The legal status of them is pretty questionable. A lot of the justification for them in the US seems to be based on the First Amendment, and since Canada's laws are a little different, it might be even more questionable here. I just found this article written by Jon Penney (a Canadian lawyer and a great guy that I've met and talked to a few times), and he doesn't seem very confident about the legal basis for them in Canada. I could probably contact him and talk to him about it more to see if his opinion's changed at all in the last few years.

    • They're kind of only usable once. Once you remove it, you can't really put it back. Even the people that support warrant canaries seem to think they get even more iffy if you start trying to increase the specificity of them (such as by re-adding a new one or narrowing down the date range).

    • Even in the cases where they've been used and removed, nobody seems to care and nothing happens. Reddit had one; it was removed a couple years ago. Was it removed because something actually happened, or did they just not want to have it any more? What did removing it actually mean? Regardless of the answers to those questions, as far as I can tell, nothing significant happened in response to it being removed. So was there even a point?

    Deimos

    15 votes
    1. [2]
      asv
      Link Parent
      I have looked at the GitLab repo and the question was more along the lines of "Why have you factored it this way?" instead of "Why have you chosen minimalistic visuals?"

      I have looked at the GitLab repo and the question was more along the lines of "Why have you factored it this way?" instead of "Why have you chosen minimalistic visuals?"

      3 votes
      1. creesch
        Link Parent
        You did see that the first section I included specifically goes into the technical design choices? It might still not be enough for what you are looking for, but it certainly isn't about visuals....

        Why have you chosen minimalistic visuals?

        You did see that the first section I included specifically goes into the technical design choices? It might still not be enough for what you are looking for, but it certainly isn't about visuals. That is just the second section I included as some extra info.

        7 votes