Hello! It is an honor to be around here for this press. My name is BUU-BEET. Short for "Bnuyy Under a Universal Big Electronic Environment Thing." You may be wondering the lack of the smooth voices of Betty. As you may know, Betty is a really busy person, who spends days and nights working on all sorts of wonderful projects. They sent me the general ideas of the topics to be discussed in this session,stating they couldn't participate in order to concentrate on the website. We wish you the best, little mice! Anyway: Today, let's talk about some very interesting things going onwards for the site: One of these, you may already know by the latest devblogs, which is Optimizing the site for the current, and the future. This part is where i'm gonna go a bit more indepth in this session, including technical details of the current modifications being applied to the site for this quarter. The second, is more or less a discussion table. Allowing us to talk about what is coming for the next version of the site, with the objective of bringing previously-debated but not released features to the site in it's origins. And finally, We are going to be discussing about upcoming changes to the site's experience in the future. Expect a ton of exclusive concept art for this segment! Let's start with optimizations first. When it comes to optimizations, the main thing the site struggles with at the moment is Bloat. Such a cute term that i could repeat it so many times. However, It's like sugar. A big devil when exceeded. It's nearly close by a quarter at this rate. While the site incredibly loads itself with less than 1 megabyte of data, If we add more features to this site, to which we will by 1.5, more on those features later: A major spring cleaning is gonna be needed before we touch on anything new. Some of the low-hanging fruits are easy to explain and solve, while others require a little bit of extra functions. Right now, The 80s dot Zone uses some dependencies that during the development it was added in order to supposedly help on development But, in reality, it caused far more issues than contributions. And removing such dependecies can help on both workflow and also on general package sizing. Both on development and also on live production. There is categories for pretty much all the site addresses, including appearance, organization, and also troubleshooting. As you can see, most of the bloat; at least from the developer side, comes from Webpack. Webpack is our current Package bundler! It tries to transpile, or for more vague explanation: translate all the code used in the frameworks we use on the site. Such as Svelte for reactive module management, Typescript for working with newer Java Script features and also have a better form of documenting and understanding the source code, and PostCSS which not just gives us new CSS features to fallback devices but also gives other extensions to facilitate on workflow. All of these are transpiled into a script format that modern browsers can understand without outputting thousands of errors due to incompatibilities. However, there is one major consequence to webpack! Not only it's generally slower than other bundlers, although more feature rich, it was also not necessarily meant for website projects properly, lacking a ton of features for helping and optimizing such things by default, And thus, requiring a Lot of dependencies to generate a simple page. How many packages are we talking about? At least, for the 80s dot zone? Let's take a look! That is quite the number. And not and exaggeration either. It is no secret that Webpack was highly despised for it's complexity, slowness and most importantly for this chapter's purpose: bloat. It even went as far as turning into a big internal meme. You may be wondering, though: If webpack was this hated, why an alternative was not considered before the site launched? Not only we were tight on deadlines, but you should also pay attention in a very important line in the meme image in question: There was simply not a reliable alternative that we could, on-the-go, move to without making massive modifications. To which, for a site on a tight initial release deadline, was a big nightmare. Webpack worked for what it did, but there was stronger competitors. Well, not necessarily parcel, but rater Rollup. However, rollup on it's own is quite complex to work with and it still wouldn't solve much of the "bloat" problem. It still very much had little to no default site support and it requires almost the same chunk, although for sure a bit smaller, of dependencies as we are currently using with Webpack. But, around the period of the site's launch, a new bundler came into the trends and changed a ton of how web projects were developed. Let's talk about vite. And no, i did not just read that name incorrectly. vite (/vit/), is the french for quick. Which, well, perfectly describes this bundler. Alongside other key features such as having a ton of improvements, especially in the development side using Rollup and ES build. And generally being a non-bundle dependant project, thus simply building your site cleanly, instead of transpiling into a custom system. By using vite, what was an average 20 to 15 second build time, is now shortened to the sub 10s. And we can go even further. Let's discuss another major bloat factor from the build times and sizes, which is Styling. Most specifically, Tailwind. I am gonna be straight to the point here, and i'm pretty sure Betty would go the same: Tailwind is not worth your time. It's an excuse for newbie developers to think that CSS is unorganized, when in reality, it's more simple than you think! And it's system is also not just a big bloat but also a really confusing thing for beginners, rather than a helpful property. Plus, tailwind also consumes more space than a regular CSS project. Around 3 kilobytes more, not to mention the general sizes to work with it in a dev environment. Speaking of dev environment, Tailwind takes at least 3-4 extra seconds from our general build times. Good riddance. These are the two main dependency cuts that helps on the build times and sizes. While i could go in depth on the rest of the small tweaks, it would take even more time from this showcase, and we don't really have that much. Plus, there are better optimizations to talk about about. So that's it for now on Dependency Handling. Before i wrap up Spring Cleaning for now, to get onto the features of 1.5, Let me briefly talk about the remaining low handing fruits! Talking about the higher fruits is a goal going onwards for the release, and there will be a dedicated text soon about these. Brotli is a compression tool that, compared to gzip, which is our current compression method, shrinks assets and most especially fonts by nearly half. This will also be useful to talk about MDI, or rather, Material Design Icons. One of the largest assets that loads on the site, totalling a whopping 100 kilobytes. While MDI is not surviving for the next release, and we're rather using separate icons instead, this would be a pretty good tool for fetching Recoleta onto the site in a lighter form as well. So, in regards of 1.5, let's discuss some of the new features that i hope to bring, even if partly, for this year. We already talked about spring cleaning in the last optimizations chapter, which is one of the core features being brought to the site that haves far more to be discussed in later sessions. Let's get into the first New feature then. Adding missing pages that were previously thought on the original website's design but didn't made the cut due to a ton of internal issues when working in the first release. The second, is apprimorating existing pages on the website by creating better accesible features, enhancing the user experience from 1.0. And finally, with this one being the most tough jobs but absolutely necessary, especially after certain announcements in the last budget press. The API for the site, which will connect features of the site in a much faster way and also give us insanely cool new possibilities going onwards. Starting with Adding missing pages. It is no secret that most of the pages in the 80s dot zone feels redundantly incomplete. It could be because of deadline issues, or general lack of elements to complement such systems. Or general placeholders. The good advantage of doing this now, is that with the upcoming optimization changes to the site these pages are now even more simpler to add than ever when it comes to the frontend, and even some of the backend aspects. Video Archive for example, is getting soon replaced by the so-called Wiki in June. This will be the first example of what i'd like to call Interactive Spaces. For those who already saw the concept art for the OLD server page, and, wait, did i just said old? Welp, i guess, i just leaked private information. By definition, when such things are leaked i am obligated to share contents of such leak in order tonot ruin my reputation. [in the background: betty screaming trying to stop this procedure] Anyway, for those who saw such concept art, expect something similiar to that but different for each page that doesn't requires much information out of the box. But, of course, keeping it's charm. With widgets filling the essentials for you to know about the services the site provides. It can be provided in all sorts of layouts, and even styles as well. Going back on wiki, More concept art on the wiki will be given later this week as betty polishes the final touches for that. The full implementation should be slowly available on the site by may, hopefully alongside some of the major optimization tweaks in the low hanging sides. Three of them are nearing it's completion right now before april! Another example of adding missing pages is one odd page that did not made the cut for the original release and was meant to replace the Source Code page on the current version. Let me, in a simplified form, introduce you to About Site. By clicking on the logo, you were supposed to be on a page with informations of contributors of the site in the past couple of months. Alongside links to contribute to the source code and such. This would make sense as the logo mostly had a purpose for a watermark and didn't had any real actions whatsoever for no reason. It would also fix the issue of people confusing who works on the site on what. I, BUU-BEET, see that as a bonus. Finally for today, let's talk about Updating existing pages with better features. One of the main features of the site right now is About team, to which had a ton bugs both during and after the first release development and was the biggest reason for a chaotic spaghetti code workaround. Because of this, we decided it was about time to rewrite this page. During a couple of months after development of the first release, designs were made for the new team layout, which should include some previously-wished features like multi-role support for previous roles, and also a better layout for multiple resolutions. Something the original about team lacks intensively. And also, we're killing rainbow slider. Main reasons go something between the lines of incompatibilities with mobile layouts and also generally unintuitive. Other features for this page is the new dropdown options, which we hope to bring some more advanced filtering systems for such in the near future. This rewrite should have it's first full-fledged concept art in the next month, as betty is busy working into other things at the moment. The implementation, however, may not make it for this year, as it requires a lot of focus, to which we are already using most of that on writing the API and also the September Project before the deadline reaches. And that should be it for this development update! for more questions, Betty should be arriving in a moment to answer your doubts properly. Thank you for participating! I am BUU-BEET, standing by.