Skip to content

mlajtos/mosaic

Repository files navigation

Mosaic

Web browser that can display multiple web pages at the same time in one shared window. A tiling web browser.

Latest release: 0.0.3
Download · Changelog


Value proposition

The main value of using Mosaic over Chrome with builtin macOS tiling can be seen on this non-exhaustive list of tasks that often pop up when you want to use web in a tiling fashion:

  1. Task 1 – create a 1:2 splitscreen from a single fullscreen window containing two tabs
    • Chrome on macOS – video, 12 seconds
      1. turn-off fullscreen
      2. tear off one tab into a window
      3. hold cursor over green (maximise) window button
      4. select "Tile window to the left side"
      5. choose the second Chrome window to fill the rest of the screen (right side)
      6. resize via the splitter between the tiles
    • Mosaic on macOS – video, 6 seconds
      1. drag out a tab to the wanted place
        • 🤬 the animation is extremely choppy
      2. resize via the splitter between the tiles
  2. Task 2 – interact with unfocused tile and repeat
    • Chrome on macOS – video, 5 seconds
      1. move cursor over unfocused tile
      2. click on the unfocused tile to focus it
      3. click on the interactive element
      4. [repeat]
    • Mosaic on macOS – video, 2 seconds
      1. move cursor over unfocused tile
        • 🤬 tile did not change the appearance to communicate focus
      2. click on the interactive element
      3. [repeat]

Features

  • Documented Design Decisions
  • Blink rendering engine
  • Written in Typescript using React
  • Intuitive drag&drop tile managment
  • Built-in DuckDuckGo search engine
    • auto suggest while typing
    • use !bang for advanced searches
      • e.g. "!g hello" to google for "hello"
  • Minimalistic dark look
  • Dock
    • drag out icon from dock to make a new tab
  • Automatic zoom-to-fit of webpage
  • Familiar shortcuts for tab managment (⌘T, ⌘W)
  • Built-in privacy
    • Adblock (uBlock Origin)
    • Blocking cookie consent non-sense
    • No history
    • HTTPS everywhere
  • System keychain integration

Development

Requirements: Git, NodeJS, Yarn

Clone repository and install project dependencies:

$ git clone https://github.com/mlajtos/mosaic.git
$ cd mosaic
$ yarn

Live development

$ yarn dev