JavaScript Assíncrono

Palestra sobre javascript usando promises.

Transcript

1. JavaScript assíncrono then Vinícius Baggio Fuentes Wednesday, September 18, 13
2. Words Matter Wednesday, September 18, 13
3. Wednesday, September 18, 13
4. User profile Wednesday, September 18, 13
5. User profile Post data Wednesday, September 18, 13
6. User profile Post data Notes Wednesday, September 18, 13
7. User profile Post data Notes read later collection collab Wednesday, September 18, 13
8. read next recommended rec. stats further reading Wednesday, September 18, 13
9. várias formas de resolver • SQL Joins absurdos • Denormalização* dos dados • Materialized Views (???) • Buscar em etapa (pipeline) * Tradução tosca!! Wednesday, September 18, 13
10. Denormalização + Pipeline* * Esta é apenas uma simulação inventada e qualquer semelhança com a realidade é um mero acidente. Post + Anotações + Further reading Perfil, foto etc Recomendações + stats Read next Compõe e serve Wednesday, September 18, 13
11. fetchPostData(id, function (err, post) { fetchProfileData(post.profileId, function (err, profile) { fetchRecommendation(id, function (err, recStats) { fetchReadNext(id, function (err, readNext) { render({ post: renderPartial(post), profile: renderPartial(profile), recStats: renderPartial(recStats), readNext: renderPartial(readNext), }) }) }) }) }) Wednesday, September 18, 13
12. fetchPostData(id, function (err, post) { fetchProfileData(post.profileId, function (err, profile) { fetchRecommendation(id, function (err, recStats) { fetchReadNext(id, function (err, readNext) { render({ post: renderPartial(post), profile: renderPartial(profile), recStats: renderPartial(recStats), readNext: renderPartial(readNext), }) }) }) }) }) LOL NODE Wednesday, September 18, 13
13. fetchPostData(id, function (err, post) { fetchProfileData(post.profileId, function (err, profile) { fetchRecommendation(id, function (err, recStats) { fetchReadNext(id, function (err, readNext) { render({ post: renderPartial(post), profile: renderPartial(profile), recStats: renderPartial(recStats), readNext: renderPartial(readNext), }) }) }) }) }) Wednesday, September 18, 13
14. Post + Anotações + Further reading Perfil, foto etc Recomendações + stats Read next Renderiza e serve Denormalização + Pipeline + concorrência Wednesday, September 18, 13
15. var data = {} fetchPostData(id, function (err, post) { data.post = post fetchProfileData(post.profileId, function (err, profile) { data.profile = renderPartial(profile) }) fetchRecommendation(id, function (err, recStats) { data.recStats = renderPartial(recStats) }) fetchReadNext(id, function (err, readNext) { data.readNext = renderPartial(readNext) }) }) process.nextTick(function tryRenderData () { if (data.post && data.profile && data.recStats && data.readNext) { render(data) } else { process.nextTick(tryRenderData) } }) Wednesday, September 18, 13
16. Futures Wednesday, September 18, 13
17. var id = '7c95f3526713' var post = future(fetchPostData, id) var recStats = future(fetchRecommendation, id) var readNext = future(fetchReadNext, id) var profile = future(fetchProfileData, post.realize().profileId) var postPartial = future(renderPartial, post) var recStatsPartial = future(renderPartial, recStats) var readNextPartial = future(renderPartial, readNext) var profilePartial = future(renderPartial, profile) render({ post: postPartial.realize(), recStats: recStatsPartial.realize(), profile: profilePartial.realize(), readNext: profilePartial.realize(), }) Wednesday, September 18, 13
18. future() realize() Wednesday, September 18, 13
19. var id = '7c95f3526713' var post = future(fetchPostData, id) var recStats = future(fetchRecommendation, id) var readNext = future(fetchReadNext, id) var profile = future(fetchProfileData, post.realize().profileId) var postPartial = future(renderPartial, post) var recStatsPartial = future(renderPartial, recStats) var readNextPartial = future(renderPartial, readNext) var profilePartial = future(renderPartial, profile) render({ post: postPartial.realize(), recStats: recStatsPartial.realize(), profile: profilePartial.realize(), readNext: profilePartial.realize(), }) Cenário A: função demora a retornar retorna rápido { t realize() bloqueia retorna rápido { realize() bloqueia Wednesday, September 18, 13
20. var id = '7c95f3526713' var post = future(fetchPostData, id) var recStats = future(fetchRecommendation, id) var readNext = future(fetchReadNext, id) var profile = future(fetchProfileData, post.realize().profileId) var postPartial = future(renderPartial, post) var recStatsPartial = future(renderPartial, recStats) var readNextPartial = future(renderPartial, readNext) var profilePartial = future(renderPartial, profile) render({ post: postPartial.realize(), recStats: recStatsPartial.realize(), profile: profilePartial.realize(), readNext: profilePartial.realize(), }) Cenário B: função executa rápido retorna rápido { t realize() retorna rápido retorna rápido { realize() retorna rápido Wednesday, September 18, 13
21. Promises Wednesday, September 18, 13
22. var id = '7c95f3526713' var postPromise = fcall(fetchPostData, id) var recStatsPromise = fcall(fetchRecommendation, id).then(renderPartial) var readNextPromise = fcall(fetchReadNext, id).then(renderPartial) var postPartialPromise = postPromise.then(renderPartial) var profilePromise = postPromise.then(function (post) { return fcall(fetchProfileData, post.profileId) }) all(postPartialPromise, recStatsPromise, readNextPromise, profilePromise) .then(function (postPartial, recStatsPartial, readNextPartial, profilePartial) { render({ post: postPartial, recStats: recStatsPartial, profile: profilePartial, readNext: profilePartial, }) }) Wednesday, September 18, 13
23. var id = '7c95f3526713' var postPromise = fetchPostData(id) var recStatsPromise = fetchRecommendation(id).then(renderPartial) var readNextPromise = fetchReadNext(id).then(renderPartial) var postPartialPromise = postPromise.then(renderPartial) var profilePromise = postPromise.then(function (post) { return fetchProfileData(post.profileId) }) all(postPartialPromise, recStatsPromise, readNextPromise, profilePromise) .then(function (postPartial, recStatsPartial, readNextPartial, profilePartial) { render({ post: postPartial, recStats: recStatsPartial, profile: profilePartial, readNext: profilePartial, }) }) Wednesday, September 18, 13
24. Grandes sistemas que usam programação funcional tendem a parecer como uma montadora de automóveis Wednesday, September 18, 13
25. function createPost(req, res) { reqFormData(req, 'post') .then(validateNewPost) .then(createPost) .then(function (post) { res.render('posts.show', {post: post}) }) .fail(function (error) { res.render422('posts.new', error) }) } Wednesday, September 18, 13
26. function createPost(req, res) { reqFormData(req, 'post') .then(validateNewPost) .then(createPost) .then(function (post) { res.render('posts.show', {post: post}) }) .fail(function (error) { res.render422('posts.new', error) }) } function validatePost(formData) { return Q.all( _validateTitle(formData), _validateBody(formData) ).then(function () { return formData }) } Wednesday, September 18, 13
27. function createPost(req, res) { reqFormData(req, 'post') .then(validateNewPost) .then(createPost) .then(function (post) { res.render('posts.show', {post: post}) }) .fail(function (error) { res.render422('posts.new', error) }) } MONADS! function validatePost(formData) { return Q.all( _validateTitle(formData), _validateBody(formData) ).then(function () { return formData }) } Wednesday, September 18, 13
28. ƒ wrap unwrap ƒ ƒ Wednesday, September 18, 13
29. Q • Promises/A+ • converter node.js-style callbacks p/ promises • all/spread, progress noti cation Wednesday, September 18, 13
30. Q + _ + js = functional programming pro-style Wednesday, September 18, 13
31. Functional JavaScript Wednesday, September 18, 13
32. Perguntas? Wednesday, September 18, 13
33. Créditos de imagens: http://www.flickr.com/photos/thomashawk/292253202 Wednesday, September 18, 13