Platform Compatibility
Showpad runs on iOS, Android, Windows Desktop, and web browsers, each using a different rendering engine. This page covers the browser and engine used on each platform, navigation behavior, and best practices for building apps that work consistently across all clients.
What you'll learn
- Which platforms and browsers Showpad supports
- How navigation works on iOS
- Best practices for performance, design, and file structure
TL;DR
- Use responsive design for all screen sizes
- Keep the top left corner clear on iOS (navigation button)
- Use CSS animations instead of JavaScript for performance
- Use HTTPS for all external communication
Supported platforms
| Platform | Browser/Engine |
|---|---|
| iOS | Safari (WKWebView) |
| Android | Chrome |
| Windows Desktop | WebView2 |
| Web | Edge, Chrome, Safari, Firefox |
Navigation and JavaScript functions
- Navigation: On iOS, a button in the top left corner allows users to access Showpad navigation and exit the web app. Keep this area clear of any interactive elements or action buttons within the web app itself.
- JavaScript functions: See SDK Integration for a full list of the JavaScript functions available for HTML content.
Best practices
| Category | Do | Don't |
|---|---|---|
| Performance | Use CSS animations (preferably 3D for GPU acceleration) | Use JavaScript animations or setTimeout |
Use requestAnimationFrame for animations | Ignore hardware limits | |
| Keep your DOM clean; remove unused elements | ||
| Design | Use responsive design (devices rotate, screen sizes vary) | Develop for a fixed viewport |
| Test inside Showpad | ||
| Set viewport dimensions and overflow correctly for Collection Viewer (iframe) | ||
| File structure | Use .html extension | Use .htm extension |
| Use clean file and folder names | Use spaces in names | |
| Use symlinks in your site structure | ||
| External libraries | Audit library size and usage; prefer lightweight options | Include large libraries without verifying performance impact |
| Load libraries locally from the ZIP, not from a CDN | ||
| Preloading | Preload only assets fetched from the network | Preload assets already stored on the device |
| iOS | Use HTTPS for all external communication | Use HTTP; resources may fail to load in iOS webviews |
Next steps
- Links - Linking strategies and local storage
- URL Schemes - Link to Experiences, assets, and folders from your web app
Was this page helpful?