214 JSJ Pebble with Heiko Behrens and François Baldassari
Check out Newbie Remote Conf!
02:11 - Heiko Behrens Introduction
- Blog 02:42 - François Baldassari Introduction
- jerryscript 06:40 - Watch vs Phone
- Pebble.js 09:32 - Memory Constraints and Code Size Limitations
- iPhreaks Episode #153: Using Mobile Devices to Manage Diabetes with Scott Hanselman 37:08 - Running Web Servers39:29 - Resources
- Pebble Slack Channel
- Pebble Developer Page
- Pebble TicToc Source 41:58 - Voice Capabilities43:06 - UI For the Round Face vs Square Face46:18 - Future Pebble Milestones Picks
- Vortex Poker 3 (Jamison)
- Thao & The Get Down Stay Down (Jamison)
- Maciej Ceglowski: Barely succeed! It's easier! (Jamison)
- The Way of Kings Trilogy by Brandon Sanderson (Joe)
- Juniors Are Awesome (Aimee)
- octotree (Aimee)
- Fully Alive by Ken Davis (Chuck)
- Sara Soueidan (Heiko)
- Jake Archibald: Using the service worker (Heiko)
- beyond tellerrand’s Videos (Heiko)
- Fabien Chouteau: Make with Ada: Formal proof on my wrist (François)
- pebble.rs (François)
- The World of Yesterday by Stefan Zweig (François) See Also
- iPhreaks Show Episode #146: Pebble with Heiko Behrens and Daniel Rodríguez Troitiño
CHUCK: Jamison Dance.
JAMISON: Hello, friends.
CHUCK: Joe Eames.
JOE: Hey, everybody.
CHUCK: I'm Charles Max Wood from DevChat.tv. Just a quick shout-out, we're doing Newbie Remote Conf in July. So, if you're a new programmer we have some awesome speakers coming up for you. We have two special guests this week. We have Heiko Behrens.
CHUCK: And François Baldassari.
FRANÇOIS: Hi everyone.
CHUCK: Do you two want to introduce yourselves?
FRANÇOIS: I think maybe two and a half years. I think we shipped the first PebbleKit JS SDK in September 2013 perhaps.
FRANÇOIS: So, it's most certainly not V8. Just to remind everybody, the Pebble Time watches have roughly speaking 256K of RAM although much less is available for applications. And about a megabyte of flash storage for software to, for all of the software that we write. So, there was no way that we could get V8 to run in that. And perhaps it's a good place to actually tell you how we got to that.
HEIKO: So, I don't have you on video chat but do you wear your Pebble Time?
FRANÇOIS: He has to see us.
HEIKO: Oh, there. There we go.
FRANÇOIS: Everybody who's updated to the latest firmware has it on their wrist today.
AIMEE: [Chuckles] So, I kind of have a naive question. Can you go into explaining why it's preferable to have it actually running on the watch versus the phone?
AIMEE: Okay. Now that you say that, now I remember that. I forgot. Thank you. [Chuckles]
HEIKO: Absolutely, yeah. If you just look at say jQuery for example you can easily go beyond 100 kilobytes. And…
JAMISON: [Inaudible] just, I mean even just the code.
FRANÇOIS: Just minified code, minified code.
JAMISON: [Inaudible] even make a single object or anything.
And then there's also stack. Whenever you call a function, yes every now and then but only if you do an algorithmic problem, you will hit a stack overflow on a browser. But that is really a depth of say 20, maybe even a hundred calls. And we have another limitation which is bandwidth. So, you think that the internet is slow when you download something? Well, the communication between the phone and the watch runs a Bluetooth Low Energy and we can in the best case scenario transmit 2 kilobytes per second. So yes, we have all these limitations. And that of course affects how you write applications. So, where should we start?
FRANÇOIS: Well, to answer your questions very directly in the first place, you're not going to take React and run it on your watch. It's just 300 kilobytes of code is just completely out of reach for us. However…
JAMISON: Oh yeah, yeah.
FRANÇOIS: I think from the very beginning…
JAMISON: I was using the…
CHUCK: Angular's better anyway, right?
JAMISON: No, I was just using that as an example of these are like the sizes of things that we're used to dealing with as browser developers or Node.
And then the next thing is… and that still means you have eval. So, you can create a string on the fly and you can eval it and all of that. But then you have to pay for the code in RAM. And the other one is that JerryScript has been designed with these limitations in their mind. So, that means not only is the bytecode super efficient but also how they represent things. They use concepts that are not new but still efficient such as tagged pointers. So, if you have a string that is short enough it's not even stored as a byte array or something. The pointer itself carries the string, if it's just short enough. And if it's a string that existed at compile time they refer to it into the bytecode. And only if it's really a dynamically created string it exists in RAM. And we even have ideas how we could compress that even further. So, we try to make it as memory-efficient when you just look at memory here, as possible.
HEIKO: Absolutely, yeah. So, we don't have as much experience as we have today with respect to external developers and how they deal with it. But we have quite a lot of experience when it comes to watch spaces and apps written for our platform. And we understand that a large portion of today's applications, C applications are taking up RAM for code. That doesn't apply to us. And then the second half is actually resources, like assets. They have bitmaps. They have custom fonts. And they want to visualize that. Little is actually going into state of the application.
JAMISON: You're talking about the existing C applications on the watch?
If you look at the characteristics of those apps it's mostly the assets. And there again, we have a few tricks here. Because what we do is as we are packaging these, say an image, just think about it. A full screen image that has one byte per pixel on the Pebble Time Chuck is wearing is already worth 24K of uncompressed data. At one point you have to have it uncompressed. Again that's something you usually don't think about. You think about the compressed format such as a PNG or a JPG. But for us it's more critical how large is it in RAM in the end? And we have that problem already. And if you think about that, two full screen images are already almost your entire amount of RAM.
FRANÇOIS: The correlation between the complexity of the platforms and the RAM available?
JAMISON: It does. Sure. So, I was imagining having to do all kinds of arcane performance tricks in code to keep memory usage down. And you're saying you don't have to worry about those things that much because you're not going to do complex things in the app itself, really.
JAMISON: Yeah. I was going to ask about that next. [Inaudible] stuff.
JAMISON: These are platform APIs you mean where there's some event you can listen on when there's memory pressure. Is that what you mean?
HEIKO: We need tooling. So, how do we visualize that? So, Chrome has great tools for example to profile your heap, the application. You can find memory leaks that way easily. Then again, that is V8. So…
JAMISON: I've anecdotally heard that advice, yeah.
HEIKO: So yeah, so we recently wrote a bytecode visualizer that shows what the engine will actually do in a scenario A and B. And it turns out that in our engine the nested function is actually cheaper if you don't return the function but call it immediately. Of course if you return it, it needs to capture as a closure. It needs to capture the scope and everything. But if you just call it inline, and not pass all these arguments again and again, it is actually more efficient on our engine. And that might not be true on V8 but it is on ours. Now, the problem is how do we educate developers that are really keen on optimizing their application? And how do we teach that? My hope is that everything runs good enough so that they don't need to care. But at one point yeah, you're right, tooling needs to support developers and educate them.
Heiko and I have both spent a bunch of time going to hackathons on behalf of Pebble. And again and again what we find is some very, very eager developers who sit down with their Pebble, google Pebble development, and see our C SDK and get very discouraged because they don't have tool chains installed. Or they use a web IDE and build their first app and it just crashes repeatedly. C is extremely powerful and very high performance. It has all of these quirky behaviors and it requires you understand quite a bit about what goes on under the hood for you not to shoot yourself in the foot with it.
HEIKO: So to me, it boils down to productivity. So, if you do C and it sounds very Microsoft-y but if you think about it just as like a visual developer, how would you do web development today? You would create a web page and then you use the DOM inspector, hit on your element, and then you tweak CSS styles on that particular element until it really fits your needs. Now, in our traditional world, you had to write C code to express whatever you want, like moving things two pixels to the right maybe. And then you need to compile and deploy on the watch. And then you look at the watch. 20 seconds later roughly you will see a result. And then you say, “You know what? Maybe it was just one pixel.” And then 20 seconds later you see that result. Our system is highly visual and highly interactive but our tools are last century. And we really want to close that gap. We want to make it super, super fast and quickly.
And now that we have this it will be in the first phase at least our predominant development environment. So, you basically in your browser or your preferred web development tool, have short turnaround times and instant feedback, and then eventually you take that code and run it also on the watch.
CHUCK: So, let's talk for a minute about the capabilities of the watch. There are a few things that it does that I really like and as a watch owner and Kickstarter backer, there are definite things that I get excited about. One of them is just that if my phone rings I can look at my watch and see who's calling and stuff like that. The notifications are also really nice to have. But I think you kind of expect that from any watch that has, that is I guess deemed as smartwatch these days. What are the capabilities of the Pebble though beyond that and some of the other basic functions that it already has? Like alarms and we can dig into health tracking in a minute.
HEIKO: So, you're asking for the whole experience to an end user or what developers can do with it?
CHUCK: What kinds of things do you expect developers to be able to do with it?
So, this weekend for example I was sailing and I could use my watch which wasn't connected to the phone back then because it was down in the cabin. And that watch was just great in that case to show me time. But that is at least something when you're out in the sun. So, it's an always on display. It is water-resistant to what is it, 30 meters or something. And with that you really have a small computer and can write applications of any means actually for the watch. Then recently we introduced something also more web oriented. It's called timeline.
So, we encourage developers to do that. But people did all kinds of crazy other things such as full-fledged games or I don't know, browsing through catalogs of products actually, which is ridiculous. But they did that.
FRANÇOIS: There's this whole community of people now, I wish I had the link but I will maybe dig it up later, who use Pebble as an on-wrist display to monitor the blood sugar level of their diabetic children because there are a number of Bluetooth-enabled blood sugar monitors. And there are no easy ways to always have on you those readings which can be quite vital. I think that. I was blown away. I think that led to an article on the Wall Street Journal. People have been building incredible things.
CHUCK: I'm going to pile on that real quick. We did an episode of the iPhreaks show about that sort of thing with Scott Hanselman. So, he's a type 1 diabetic. I'm actually a type 2 diabetic. But yeah, he talked about how he has connected up all of the monitoring and things to your phone. And I don't see why you couldn't then extend that to your watch.
FRANÇOIS: It makes so much sense. Why would you want the time on your wrist if you can have your kids' blood sugar level? That's such important information for you. And it's such a prime real estate.
CHUCK: Especially to the extent that with type 1 diabetes you absolutely have to manage it. With type 2 diabetes you can get away with diet and exercise and a few other things. You don't have to be on top of it. But because of the nature of type 1 diabetes where the patient's body doesn't make insulin you have to know what the blood sugar is all the time. And you have to be reacting to it all the time. And so, that's why it's so critical and why it's so nice to be able to just have it readily available for those parents.
JOE: I just wanted to talk about, you talked about some really awesome looking apps. But I think one of the questions that's probably been on everybody's minds since the beginning of this is, “Can I run a web server on it?”
FRANÇOIS: What's the smallest web server today? You know, people ran…
JOE: Well, I ran one off my Commodore 64.
FRANÇOIS: Yeah, people ran web servers on their 1980s computers. And the original Pebble is roughly a Macintosh 128 in terms of performance. I don't see why you couldn't find a web server for it.
HEIKO: But you would need to run IP over BLE.
FRANÇOIS: Which exists.
HEIKO: Yeah. But…
JOE: The wheels are spinning already.
JOE: Next release.
FRANÇOIS: Somebody's going to build a cloud backend running on Pebbles, like with [inaudible]
JAMISON: Pebble cluster.
JOE: Uhuh. Can I hook it up to Firebase? [Laughs]
JOE: Oh wow.
HEIKO: Crazy I think, yeah.
JOE: That is pretty crazy. So, what about getting into all this and learning it? What resources are out there for tutorials and help and communities?
CHUCK: Yeah, keep…
HEIKO: We have a…
CHUCK: Keep in mind this will be released in about two or three weeks.
FRANÇOIS: And if you go in the Rocky.js repository on GitHub you will find a number of examples, some written by us, some contributed by the community. Of course the APIs are still in flux. In fact we'd love it if people built applications using the APIs we currently have and propose some changes and give us some feedback on how those things work for them. And hopefully and in the future, certainly in the future, some versions of those APIs will run on the watch and you'll be able to copy paste the app that you wrote for Rocky.js in the browser and run it on your watch.
HEIKO: Yeah. As a matter of fact, the source code for Tick-Tock that is running on your watch Chuck is open source. And you can look at it already today. And literally the same code runs in our cross-compiled framework in the browser. And the very same code also runs on the watch today. Not yet for third-party developers because we have to figure out a few minor details. But it's happening.
CHUCK: I have one more question about the capabilities on the watch. And that is the voice capabilities on the watch. I know that it came out available for Android at some point and then I think it came out for iOS but I don't remember for sure.
FRANÇOIS: It did.
CHUCK: It did?
CHUCK: So effectively, what it is, is there's a microphone on your watch and you can dictate to your watch?
HEIKO: Yeah. So, technically on an API level you're asking for a string. You say, “Please let the user talk to the watch.”
HEIKO: And then the audio is captured. We inform the end user that this is happening so you cannot spy on them by showing a system dialog. You are talking to your wrist. This is compressed on the watch, sent over BLE to the phone, the phone talks to a rep service to create that string from the audio input, and the string will then be sent back via BLE to the watch where you as an API user will receive the string. And that just happens as the user talks to it.
AIMEE: One other thing I was so going to ask about to you that I thought was pretty interesting was the fact that you have the option to develop as far as the UI goes for a round face versus a square face. And I thought the challenges around that were probably pretty interesting.
HEIKO: Oh yeah, that's true. Actually, when we developed that we looked at different other standards. And I was hoping so much that the web world would provide an answer to this. And in fact there is a CSS proposal coming from actually the guy who's running around his company, LG. [Chuckles] They were involved [into] that standard. It doesn't really cover much of what we wanted to partly because we don't have a DOM. But also because it doesn't account for scrolling content. And then I was also hoping so much that Apple would release a round watch so they would do the work for us. But unfortunately they didn't. What we ended up with is a lot of convenience and helpers for developers.
So for example, if you logically still operate in a Cartesian coordinate system like a large square and our round watches but as you place a label somewhere you could ask it to follow the curve of display. So, we do the word wrapping in proper positions. And that goes that far that as you are scrolling which doesn't really work if you think about it because you would need to re-flow the text all the time. We actually accommodate for that. So, we do paging instead. We look for orphans which can happen now that you have paging. If your label isn't full screen but let's say it starts halfway of the screen and ends two-thirds later. We make sure that it doesn't… that lines are fully visible in all of this.
So for text for example we have this. And then for other UI elements you would need to position them. So, think of that as you are basically drawing canvas and instead of drawing text you will say “Draw that in a rectangle and do the flow for me. And when you need to calculate the coordinates, it's sometimes hard to transfer your polar coordinate system. I want to have something at a specific angle and give my X, Y, but make it so that the image, the rectangle of the image, is fully visible. Give me that rectangle please, on the top left corner. We have convenience functions for that.
FRANÇOIS: We also have a number of canned UI elements which you can push directly to the screen. For example one of them I think is called the action menu. It's a full screen UI element which shows a number of options and lets you, it will highlight the one that's currently selected, let's you click a button and go deeper and deeper into the menu. All those UI elements are available as a single API and will push a UI that's adapted to the display that the user is on.
CHUCK: So, what can we expect in future versions of the Pebble firmware and in future versions of the Pebble watch?
CHUCK: Alright. Jamison, do you want to start us off with picks?
JAMISON: Sure do. Okay, I have three picks today. The first pick is I got a new keyboard a couple of weeks ago. And I love it. It's called the Poker like hand poker kind of thing. It's kind of a weird layout. It's called a 60% layout so it doesn't have a number pad or separate function keys. So, it's really compact. But I enjoy it. I like keyboards and this is a cool one.
My other pick is a band called, I think it's called Thao or “Tao” or something. Thao & The Get Down Stay Down. It's just like happy, joyful music. I don't know how to describe it really. Happy pop music.
And then my last pick is a talk by the guy who makes Pinboard. He's Polish so I don't even want to attempt to pronounce his name. But he gives fantastic talks and I really like this one. It's called 'Barely succeed! It's easier!' and it's kind of a bit of a takedown of how some of the tech industry works and focuses on rocket ships to the moon. And his approach is basically he just tries to build something that is sustainable and that people like and actually makes money. And he's a really interesting and entertaining speaker. So, I like this talk. Those are my three picks.
CHUCK: Alright. Joe, what are your picks?
JOE: Well, I'd like to pick every book that I've ever read because so far every book that I've ever read has been awesome. But instead of picking every book, just pick one specific one. And that is the upcoming Brandon Sanderson, that's the third book in 'The Way of Kings' trilogy. And so, I can…
JAMISON: Oh my goodness. My ears.
JOE: It's going to be out later this year. Yeah, sorry about that. That was…
JOE: I didn't mean to excite him that much. It's the third book in 'The Way of Kings'. What's it called? 'The Stormlight Archive', third book. And I'm really excited for it. So, I've been re-reading books one and two in order to get ready for that. So, I would like to pick the entire series of those books. I've been a huge Sanderson fan since I read the first Sanderson book I ever read. That'll be my pick, 'The Way of Kings' series. And normally I would pick two or three things but they're such big books it will take you a year to read them anyway. So, I think that's like a year's worth of picks.
CHUCK: Yep, definitely.
CHUCK: Aimee, what are your picks?
AIMEE: Okay. I have two. The first one is a group that I heard mentioned on the Code Newbie podcast. And it looks pretty good. I know there's a Code Newbie [inaudible] but this might be something in addition to that. But it's called Juniors Are Awesome. But I know firsthand that it is really, really beneficial to have other people to talk through. As you get better and better you tend to forget what it was like learning. So, if you don't have the luxury of being around other people like in a bootcamp or something having organizations like this are just amazing. So, yeah it's called JuniorsAreAwesome.org. And there's a link in the show notes.
The other pick is just a small browser extension that I added yesterday that looks pretty cool. It's called Octotree. So, if you're browsing GitHub there's a little button in the top left corner that you can just more easily navigate the file structure. So, that is it for me.
CHUCK: Awesome. I just have one pick this week. It's a book. It's called 'Fully Alive' by Ken Davis. And it's really about living your life to the fullest. And it was a terrific book. I listened to it on Audible. It was about five hours long on Audible. It's just not a really, really long book. But if you are looking for something that will inspire you to do better and talk to you about ways that you can live your life to the fullest, live your life 'fully alive' as he puts it then it is a terrific book. So, I'm going to pick that.
Heiko, what are your picks?
HEIKO: Yes, originally I wanted to link to an article about how to produce proper SVGs or vector graphics from a designer perspective so you won't end up with all the mess in the SVG file. It's written by Sara Soueidan. And then I realized that actually she, the person will be my pick. She's just awesome. So, she's actually… I'm pretty sure you know about her already but she's actually a frontend developer and she had some good overview about CSS. But her recent content is mostly about SVG and how to deal with them and that's just great.
So, the second one then I realized is actually also a person, Jake Archibald. I think he was on the panel in the earlier days of this podcast. And it's not so much actually about him although I enjoy most of his talks and talking to him in general. But it's about service worker. And service worker, so it's been around a while, is I think underrated right now. I think that is the next great step in the whole web world that brings us closer to the native experience. And if I had to pick anything in particular it's a bit dated and also the audio quality isn't the best but it's his talk at the Generate London 2014.
And my third is a conference run by another fellow German, Marc Thiele. He runs the Beyond Tellerrand among a few other conferences. And the videos of the 2016 issue of that conference just came out last week. So, my pick are those videos. And I think… so, I spoke definitely with Jake together at an earlier Beyond Tellerrand. But I think Sara was also there. So, that says it all. That conference is just awesome.
CHUCK: Alright. François, what are your picks?
FRANÇOIS: Okay. I got three picks as well. So, the first two are related. I've been super interested in what kind of programming languages people have managed to run on Pebble. And so, the first one is a link from the Ada core team's blog. And they got Ada, the programming language running on the watch. They wrote a couple of apps in it. And then formally verified them which I thought was super cool.
And then there's a GitHub project that similarly lets you write Rust applications on Pebble. I love Rust, have been following the Rust development out of Mozilla for the past two years roughly speaking. And I was really, I built actually a prototype of something similar. But that project is much better than what I had done.
My third pick is a book. It's called 'The World of Yesterday' by Stefan Zweig. If you watched the movie 'The Grand Budapest Hotel' by Wes Anderson it actually I believe, it inspired it. Favorite book of all time. It's about the golden age of the 1920s and living through that and then the horror that happened in Europe all after that. It's really sobering. I recommend it to everyone.
JAMISON: This is, the book inspired the movie you said?
FRANÇOIS: The book inspired the movie, yeah. The book is old. It was written in the 1940s. But it's still worth the read.
CHUCK: Awesome. If people want to follow up, see what's going on with Pebble, with Pebble development options or with the two of you and what you have going on, what should people do?
HEIKO: So, we are both on Twitter. For me it's HBehrens. For you it's…
FRANÇOIS: Baldassarifr, my last name, first two letters of my first name.
HEIKO: I think we need to put the links there.
FRANÇOIS: We will.
CHUCK: I also want to just shout out, you did come onto iPhreaks. So, if you want the perspective from mobile developers go check out the episode that we did with Heiko on iPhreaks. And yeah, I also just want to shout out about the watch because it's a great watch. I have friends who have the Apple Watch and I have to say that the thing that really, after talking to them, gives them buyer's remorse more than anything else I think is the fact that I plug my watch in about once every week and a half. [Chuckles] And it does most of what they rely on their Apple Watch for. So, if you're looking for a good option that costs a little less than the Apple Watch and does most of what you're thinking you want, then definitely give the Pebble a look. I have the Pebble Time Steel and I'm super happy with it.
CHUCK: Sweet! Alright, well we'll go ahead and wrap this one up and we'll catch you all next week.
[Bandwidth for this segment is provided by CacheFly, the world’s fastest CDN. Deliver your content fast with CacheFly. Visit CacheFly.com to learn more.]