Introducing Teleport: Over-the-air hot reloading & debugging for PWA’s ⚡️
PWA’s are awesome. Using a single codebase, they let you build apps that target both mobile & desktop platforms.
But there’s a catch: tracking down, repro-ing, and debugging platform specific issues is downright painful—especially on mobile devices.
We experienced this problem firsthand while building StackBlitz, the first IDE for PWA’s that’s completely powered by PWA API’s itself (inception!), and we wanted to solve this problem in a super simple & natural way:
Wouldn’t it be great if you could instantly hot reload & debug PWA’s on any platform, by just opening a link?
Meet Teleport ⚡️
Teleport is a lightning fast dev-server proxy that:
- Enables instant hot reloading & debugging across devices, airwaves, and continents 🌎
- Requires no client config — open a link and it “just works” 🏖
- Makes building & debugging PWA’s a total breeze ✨
Over the past two months Teleport has been rigorously stress tested against the millions of developers who use StackBlitz, and today we’re excited to announce it’s officially in technology preview! 🎉
You can try Teleport now on StackBlitz.com by simply starting a new project from the homepage (make sure you’re signed in), open the dev server URL on your phone/tablet, and then start typing!
How it works ⚙
Teleport was launched live in April where we conducted the first real world stress test against 1000+ concurrent devices in the audience—you can watch the short 5m overview below:
On local environments, Teleport integrates with webpack/wds & synchronizes changes to a mirror server. Clients then connect to the mirror server for live previewing which auto injects code to establish 2-way communication: downlink for executing HMR updates & debug commands, uplink for emitting debug events (logs, errors, etc). At the time of this writing we support both Node/SocketIO and Google Cloud Functions/Firebase as mirror backends, and it’ll be possible to add more in the future.
Over the coming weeks we’ll be rolling out new updates that enable running test suites over Teleport, remote DOM/network inspection, and even hot reloading+debugging your app’s Service Worker (and Web Workers) completely over-the-air 🤯
Is there a Teleport CLI available?
Not yet, but we’re working on it! You can sign up to be a part of the beta here. You can also follow us on Twitter or star our Github repo to stay in the loop.
What build tools does Teleport work with?
Right now Teleport is designed to work exclusively with webpack, but support for other build tools like parcel and browserify are on our roadmap.
Will it work behind firewalls/on-prem?
Yes, but you’ll need to run your own Teleport mirror for the CLI to connect to.
Can Teleport be used in online playgrounds/docs?
Certainly! We’re currently working with a handful of partners & developers to integrate Teleport into coding tools across the web, and a handful are landing soon. Check out (and star :) our Github repo to stay in the loop!
PS — For those of you in Belgium, we’ll be giving a talk at Gears this Thursday (6/21) about Teleport & more. Hope to see you there!
A huge thank you to… ❤️
- The awesome folks on the Google Cloud & Firebase teams for sponsoring the servers powering Teleport 🔥
- David East for saving the day during our first real world stress test 🍻
- Google, Angular, Nrwl, Kendo UI, Auth0, and all the other amazing patrons who make our work possible 💪
- The millions of awesome developers (like you!) who use StackBlitz! 🙌
