Problem

• Developer wants to see how their website will look like and work on a different device (usually a phone or a tablet)
• Using an actual device simulator (like XCode, BlueStacks, etc.) is tedious, slow, so most developers just use the browser’s built-in mobile view

In other browsers

• Simulating devices is not a primary concern of these browsers
• Getting to the simulation takes a few steps
• The simulation is super basic and hasn’t been updated in years
• Other browsers don’t take in consideration the Browser UI and the OS UI, so the screen height is always wrong
• The device list is always outdated
• Most of the devices don’t have a frame, or the frame looks bad
• Devices have a hardcoded “touch” or “no touch” option, you cannot easily toggle between the two

In Sizzy

• Sizzy, just like other browsers, doesn’t simulate different browser engines. However, it’s the closest you’re going to get to a mobile device.
• Sizzy simulates the real device height
  • This might be the most important pro when it comes to simulations.
  • For example, in Google Chrome the screen height of an iPhone 12 is 844 px when in reality you have around 580px available for your website
  • Sizzy simulates this by displaying the Browser UI & the OS UI (which they take a significant portion of the viewport)
  • This way you will actually know how much vertical space you will have left for your website
  • You can also toggle the Browser UI & OS UI if you don’t want to see them, but you’ll still get correct screen height for every device
• Sizzy simulates the following:
  • Pixel Ratio
  • User Agent
  • Device frame (it has real frames for most of the devices)
  • Edge glare for curved devices (i.e some Samsung Galaxy phones)
  • Software keyboard when you’re focused on an input
  • Browser UI
    • You can choose between Chrome, Safari, etc.
    • For Safari, you can also switch between different versions of Safari (iOS 14, iOS 15, Legacy, etc.)
• Sizzy also animates and resizes the browser UI on page scroll, just like the real browser animates it on a mobile device
• Sizzy has way more devices out of the box
• The devices are always updated to the latest devices
• In Sizzy you can toggle between touch cursor and regular cursor in any device (if the device supports touch ofc) This way you work with the regular pointer, and you can enable the touch cursor only when you need to test certain taps, gestures etc.
• Taking screenshots of a mobile view in Sizzy is better, because you will see the device frame + the browser/OS UI in the screenshot, so it looks more realistic