 Hei, mae hi, mae'n Gaeles Ffengolos. Mae'n gweithio'r cyfnod ei gaelig digital. Mae'n gweithio. Mae'n gweld i gaelio y frontennu javascript arall yn Mba ac D3. Mae'n gweithio'r gweithio'r gweithio, sy'n gweithio'r gweithio'r cyfnod. A hynny'n gweithio'r gweithio'r gweithio'r gweithio'r gweithio. So, mae y gweithio bod yn addegio'ch rhwb yn lawr newid yma. Mae ydych chi'n gweithio'r cwyl ffordd ac mae'r ddioedd yn ein bwylltau a chymp swordiwch chynllun mewn gyda'r adegio. Mae'r ddolygu oedd sy'n gweithio'r adegio, maen nhw'n fideall y dyfodol yn cael eu gwirioneddol, mae'r bwysig tarreg yn gweithio'r cyfrolyniad a fydd ni'n flodd ar y cwyl. If you've got a really large scale app with a lot of data then at least with out threading your basic options are to just hunt and do all of it on the server side which makes sense of some things but sort of really sucks for other things. felly y cynnwys hwn yw'r wath pernodydd. Dwi'n credu bod y fant hey o niferragedтаeth ynchwil. On ma hefyd na ydy oherwydd roedd yr waiting fel seniors resitor mwyau y brno. Mae'r cyntaf o'r cyfnod o'r cyfnod yn unigodd y gallu gwahanol a'r ddweud i'r amser o'r hyn sydd, ond mae'n mynd i'n ddechrau'r ddatat o'r ddin o'r dweud o'r ddweud, yn gyfnod o'r ddweud, yn dda i'r ddweud o'r llyffydig, yn ddweud o'r llyffydig a'r gweithio'r gweithio'r ddweud. Mae'r ddweud o'r gweithio'r ddweud a'r ddweud o'r ddweud. ymwneud, mae'r hollbrowseid ymwneud, mae'r ui'r cyffredin. Felly, gweld i gyd ymwneud hynny yw gweithio'r unrhyw gwrthwyr. Rwy'n cael eich bod yn ddiwedd. Felly, mae'r cyfrifio cymdeithas yw'r ysgolion ar ymwneud, rydym yn gwneud ffordd ymweith, ymwneud ymwneud. yma, mae'n rhan o'r unrhyw, mae'n rhan o'r unrhyw deilig, ond rwy'n cael eu cyfnodd y 41st Cymru Fybannu Argyllud. Rydyn ni'n dod o'r pethau anumatol. Rydyn ni'n gweithio'r cyfnodd ar y brwaser. Byddwn ni'n gweithio'n gweithio ar y brwaser, a rydyn ni'n gweithio'n gweithio'n gweithio'n gweithio'n gweithio'n gweithio'n gweithio'n gweithio'n gweithio'n gweithio. Rym wrth yr dyweddoch, yn gweithio, ac rwynt parties scanion, gwneud fod yn llwites Herzdiwch dyma. This is the basic problem that we have. So, the threads generally solve that problem although it itself brings a lot of other problems, so mostly around sharing data There are various solutions that different languages implement to solve this. So things like SPM and Closure, the actor stuff in Erlang, the like, GO-ROOs things and whatever. But basically they all revolve around not sharing any data with thread. So enter web workers in the browser. Web workers in the browser version of threads they have an API that's really similar post message, which is great because it's sort of easy to use, but it sort of sucks because it doesn't really work very well with Ember apps. Web workers also don't share any data, which also sort of sucks mostly because you have to serialise all your JavaScript objects into playing JavaScript. Which Ember objects sort of aren't, which makes everything a lot trickier. And there's no sort of code sharing, so you don't get to use Ember inside your threads either, which is also kind of awkward, but it's not sort of a massive problem. So the question is, when should you do that? So if you have a really large amount of data in our app, we're doing, we're sort of searching on key presses for sort of between sort of maybe 15,000 or so records, which in the grand scheme of things isn't that many, but in the context of our Ember apps all takes a bit too long. We calculate sort of collaboration data, which again sort of takes a bit too long, and we calculate trends between up to sort of 11,000 different records, which are sort of per year and then need sort of splitting out into sort of 40,000 records and then sort of summing up and all this sort of thing. So it just sort of takes, it just sort of takes too long. So when you've optimised it already and it still takes too long, that's sort of when you might switch to something like web workers. I think I wouldn't know either that. So parallel.js is something that came out not that long ago. Essentially it's a wrapper around the web worker API. It's basically using promises and it lets you just pass in raw functions, which it then injects into the web worker using function.prototype.toStream to turn it into a string. That obviously means that you lose your scope, but it's a web worker anyway, so you do that anyway, which isn't a huge issue. It sort of looks like this. So here we've got essentially the same thing. This time we're summing three Fibonacci numbers because we're now using threads and we can. This is the parallel.js API. You start off, you create a new worker passing in data that you want to operate on. So in the real world this would be sort of a really large list of something. You can map over that list to do something with it. You can reduce it to do something else with it. It's all promises so you get the result back afterwards. We can see it running in a thread and we can see that it keeps going around, which means that it's not locking up our browser UI. So it still takes time to do, but it takes maybe a bit less time to do and it's sort of comfortable because it doesn't interrupt anyone's workflow. So Ember Parallel is a small wrapper in the top of that to make it play nicely with Ember. Essentially there's three different things. The first thing is some code to turn anything into a plain JavaScript object that can then be passed through to a web worker. The next part is a sort of computer property, but one that works with promises. Sort of like the model function in a router, if you return promise from that it just sort of turns into the correct property. Sort of like that, but that's basically used for the wrapper around parallel.js. These are the three basic functions within parallel.js. They all work like computed properties, which makes everything easy. You can use them in different places, like however you want basically. Start off, we can tidy up the code a bit using these computed promises. From what it was before, it's effectively the same, but we now don't have a then block. We just return the promise directly and then the title here just becomes the value. We can also pass in an initial value as well in case you want to do anything with that. You can see the initial value being populated and then when it eventually finishes it just sort of switches over to the right value, which is kind of cool. The actual syntax itself works pretty much how you'd expect with the computed properties. Spawn function takes a list of dependencies, function and an initial value. It's probably worth noting that inside this function, as with the other functions you can't reference anything outside of it like before. Everything you do has to be inside the function. Here we're sorting an imaginary list of thousands of elements without worrying about it. Same thing with a map we can map over a theoretically really large list of stuff without worrying about it. The thing worth mentioning here is that we have to name the function before we can do things like recursion with it. That's again a limitation of web workers and the parallel JS library. Reduce is the same sort of thing. It works slightly differently to the standard JavaScript produced function. It gets an array of two elements, the first being one element from your initial array and the second being a different element from your initial array. The difference being that after a while the first element may have already been reduced so here we'll check if it's an array, if the first element's an array before operating on it and we do different things depending on that. That's the basic API. Again, the limitations, there's no code sharing at the moment. It uses, as far as JSON serialisation goes, there's a very sort of rough to JSON method that attempts to turn anything into a JSON object. Things like EmberModel and EmberData provide their own to JSON method which works a lot better for their particular use cases. The idea is that they just sort of work because Ember and conventions and what have you. We can then rewrite our earlier example again. We've now split out the map and the reduced portion. The benefit of doing this is that we then effectively cache the Fibonacci numbers. The reduced function here is obviously pointlessly simplistic but imagine if it did something with some other property as a dependency of wealth that took maybe a bit more time. The benefit of splitting it out here is that the Fib is only calculated once and is then cached so you don't have to spend all the time calculating it every single time which is cool because that's how computer properties work. It runs as we expect and it does effectively the same thing. That's basically it. That's the library. It's a really small library. It serves a very specific function and hopefully you can use it in other ways for whatever is useful if you're working large amounts of data. It's still pretty early. I wrote it last week maybe or a couple of weeks ago or something so I've not worked on it that much. The next steps like more helper functions like map and reduce it all but we can probably add some extra useful ones. Parallel.js does allow code sharing of a form. It wouldn't be code sharing in the form of load the whole of your ember out into a web worker because that's not how web workers work but you would be able to do something like this and that's roughly what I thought of earlier today when I wrote it out for something that will hopefully allow you to do some sort of code sharing. That's it. Any questions? For us at least it's not so much that it's faster. We essentially use it to process data to get it into the right format to generate graphs so that the graphs take a while to load. It isn't really that much of a problem. The main problem is that the whole, well depending on browser, the whole browser or the whole tab sort of locks up while you're waiting. The main issue for us is that so just the physical act of pushing it into a web worker fixes that. It would also be faster depending on what you do. Parallel.js fires up for web workers by default I think. If you run something like map over it it will run that much faster. Depending on how complicated your objects are there's also a cost in serialising it which is probably worth there in mind. You just said Parallel.js fires up for workers by default. Does it distribute the map across all four workers at once? So you could get into a race condition where you've operated on the array in one worker so the other changed something. So the browser copies the raw JavaScript object into red so that nothing is shared which is why you can't access anything. So what does it do then? Does it cleverly chunk the array up into orders I've not really looked into the internals of Parallel.js. I imagine so. They might just sort of loop through and pass each thing in turn into the worker. The basic web worker API is fairly simplistic so it shouldn't be too hard. Is it a new demo right now that uses it in practice? Not really, just the small demos that we have here. There's another similar small demo on the GitHub repository but it's still pretty small. Secondary question then. Do you think that the constraint of co-chairing is actually, it kind of sounds like a useful one? I think it sounds to me like it's just making it obvious to people that they're not allowed to. It may be worth changing the API to make it more obvious because it may be just defining it all in line. I'm sort of used to doing it in functional languages where it's sort of not an issue because data isn't shared by default anyway and everything is sort of mutable by default anyway so you can just sort of share stuff and there's no state to worry about. There's probably some things that we can do. Web workers themselves have evolved a lot over the past few years. The reason this is now possible when it sort of wasn't before was before web workers would only accept a path to a JavaScript file on the same subdomain and they'd only execute that file and they'd now accept raw functions which means that you don't have to faff around with loads of extra files. Yeah because that's how I think in the 8th set it does the syntax I'm writing it with by looking at the right file. So you said that your key use case is that you don't want to tie up the UI thread. Yes. But if you have four web workers, is it somehow thoughtful that it was doing enough work where it still crashes your tab? We've not run into that issue yet. There's two ways of solving it in the browser. First way is like this with web workers. The second way would then be to do all our work a bit at a time and then sort of send everything through a set time out to give the UI thread enough time to update and they sort of come to the same sort of thing in that the UI thread is then nice and responsive where one way is really awful and horrible. But you could have web workers lining their coins and crash your... You could be, so it would probably be really slow because it doesn't use the GPU and it doesn't use A6 or whatever. Yes. Yeah you can do that with web... Can you just repeat the question? Yes. So the question was, can you call other web workers within the web workers themselves? Yes, you can do that. Web workers let you do that. But it's not by default built into and parallel. As far as I know, it's not built into parallel. It's still JS though it might be. But at any rate you can still spawn a new web worker because it's just sort of JavaScript. Yes. I don't, sorry. I think all the major recent browsers support it. I've got feeling recent-ish versions of IE only support web workers via named files still. Which sort of means that it's probably not going to work in recent-ish versions of IE. I'm not sure what IE 11 is like. Can I use says IE 10 up? So parallel JS provides fallback. Yeah. I've not actually tested out fallback so I can't tell you whether it works properly or not. But the recipe does. So the application you're building are the use cases you've been attacking for B2B your control audience control browser? Yeah. We've got a very limited audience at the moment. So things like IE to whatever don't really concern us that much. In the dummy category, I think the old web workers, obviously there's progress being made but qualitatively, is this a rapid area for them that you do expect to see in both the desktop and mobile platforms in the next year or is it? Like web workers have been around for a few years now. So I think most of the limitations are around sort of security and sort of data sharing and they're there for a good reason. So I think mostly it's sort of better library support and if that can be fleshed out better then things will improve a lot faster. Okay. Have another round of applause for Ben.