Browser Makes Tiny Office Suite

There’s a recent craze of people living in tiny houses of 400 square feet down to as little as 80 square feet. Maybe [zserge] was thinking about that and created a very tiny office suite in which each tool weighs in at less than 1K. If you are guessing you couldn’t squeeze much functionality in C or C++ code or even assembly, you’d be right. The language of choice? HTML and JavaScript. So while the code is small, it relies on a pretty big piece of software. On the other hand, you have a browser open right now, so the incremental cost of using these tools is very small.

We get the idea that there’s not much chance this is going to sweep the shelves of Microsoft Office, Libre Office, and all the many competitors. However, it is a pretty stunning example of what you can do with modern HTML. There’s even a GitHub repo and a subreddit.

The text editor is only 63 bytes and can live inside a bookmark in the browser. While it doesn’t actually have the real features of a word processor, you can use Control+B and Control+I to set up bold and italic text. The spreadsheet is a marvel at 741 bytes and really does formulas using the somewhat unsafe eval() function. The functions don’t evaluate until you leave the cell, even if you press enter, so if it seems like it isn’t working, just try clicking in another cell.

For a paltry 410 bytes, there’s a drawing app and presentation module that weighs in at 668 bytes. This last is really just the text editor with some hotkeys to make bullets and headers and the like. There’s a hardcoded limit of 50 slides, but you could change that if you are more verbose.

Saving things can be a bit tricky. You can save as HTML or print using the browser’s native functions. You might have to take a screenshot of the drawing app. Overall, these little apps are a bit tongue-in-cheek, but we have to applaud their function to size ratio.

This project made us think of the JavaScript art project we covered before. We saw a similar technique used to provide serverless websites.

17 thoughts on “Browser Makes Tiny Office Suite

    1. “So while the code is small, it relies on a pretty big piece of software. On the other hand, you have a browser open right now, so the incremental cost of using these tools is very small.”

  1. I have an HTML template I write business letters with. I write the stuff in Markdown and paste it into a static HTML file. I can create top quality PDFs from it, but it also has a function to export everything as a static HTML file with not JS and all CSS & a SVG company logo embedded (fonts not included). Those exports are usually around 15% the size of the PDF.
    I always thought about releasing it somewhere, but it is too much tailored to my use case. But as soon as I finish my Markdown replacement, I will absolutely do so… in 1-20 years.

      1. I don’t really consider it usable by others. Most annoying problem: It either needs firefox with an about:config hack or a local webserver to let the template load local files. (I could add HTML5 upload, but thats annoying). Also everything in the template is hardcoded. And it is only suitable for single (printer)page documents. I tried doing multiple pages, but HTML doesn’t support figuring out what text goes on what page. So I tried doing it manually but that’s not correctly working yet. And that gets quite complicated quickly…

        If you are familiar with web development a little and interested, I might release it in a dirty way. But otherwise, don’t bother (yet).

    1. I’ve always wondered why we don’t have better separation between presentation and data in documents.

      It seems like you should be able to write something in one template, then switch to a different one and have the text from your fields carry over.

      Like, we could have a no-code template creator. Drag the “list” block to the page, give it a name, and a list box control shows up. Switch to a different template with the same name, the data is still there. Advanced users could use CSS or javascript template code to control how the document actually renders, like a web based “resume maker” can.

  2. Often, I will open the program geany (a small text editor) to keep temporary scratchpad notes when researching or reading something. I just found something easier, in many but not all situations, and this is IT. I have tested the text editor and the spreadsheet and both work as advertised. I am amazed at how clever some people are. Both the editor and spreadsheet are now in my bookmarks bar.

  3. This is quite neat- I really do open up Notepad several times a day (by typing [Windows key] note [enter]) but temporary notes. I can see the drawing tool being useful on calls- I have resorted to opening Paint for a quick doodle more than once.

    I couldn’t get the spreadsheet to work though- IE gives me a warning about “something” not being installed, while Chrome loads to a blank page. It doesn’t seem like anyone else is having or expecting any issues- anyone know what could be happening there?

    The spreadsheet seems like it would be surprisingly useful too, because I do sometimes open up a blank Excel sheet for quick arithmetic. I finding typing it out as a spreadsheet formula faster than a lot of other methods since I’ve always got Excel open anyway.

Leave a Reply

Please be kind and respectful to help make the comments section excellent. (Comment Policy)

This site uses Akismet to reduce spam. Learn how your comment data is processed.