Gulp & Purescript

Typed functional programming/thinking in Gulp, Purescript.

Transcript

1. Amsterdam NodeJS Meetup T u e s d a y , F e b r u a r y 2 4 , 2 0 1 5 ; 1 9 : 0 0 Gulp, Types, Purescript, Reuse. Theme: Mathematical modelling and performance 1 / 46
2. Jelle Herold hacker/mathematician F.S.P d e f e k t . n l / ~ j e l l e | @ s t a t e b o x | g i t h u b . c o m / w i r e s 2 / 46
3. What is a build system anyway? Automate development Workflow compiling, linting, minifying, compressing, *-ing 3 / 46
4. 4 / 46
5. 5 / 46
6. Chris McVeigh 6 / 46
7. Same principle! 7 / 46
8. The streaming build system. 8 / 46
9. Typical use case? Take some files, do something to them, write new ones to disk. 9 / 46
10. Gulp is simple Conceptually a very clean model: Virtual files Streams of those Tasks with dependencies 10 / 46
11. Virtual files v i n y l - https://www.npmjs.com/package/vinyl | source Streams of those NodeJS streams - http://nodejs.org/api/stream.html Tasks with dependencies o r c h e s t r a t o r - https://www.npmjs.com/package/orchestrator (b a c h https://github.com/phated/bach) 11 / 46
12. Code, not config Not declarative.. hrm? Powerful composition/abstraction No magic 12 / 46
13. . 13 / 46
14. hmphry.com/gulp 14 / 46
15. cite 15 / 46
16. 1964! # / b i n / s h a | b | c | d Character streams 2015 / / n o d e s t r e a m s v a r c = a . p i p e ( b ) . p i p e ( c ) . p i p e ( d ) 16 / 46
17. Power of UNIX pipes l s - 1 t | h e a d - n 1 0 f i n d . - i n a m e ' * . j a r ' | x a r g s d u - k s | c u t - f 1 | x a r g s e c h o | s e d " s / / + / g " | b c t a r - c j / b a c k u p | c s t r e a m - t 7 7 7 k | s s h h o s t ' t a r - x j - C / b a c k u p ' p y t h o n - m j s o n . t o o l | p y g m e n t i z e - l j s b r e w o u t d a t e d | c u t - f 1 | x a r g s b r e w u p g r a d e 17 / 46
18. NodeJS streams https://github.com/substack/stream-handbook s t r e a m . R e a d a b l e s t r e a m . W r i t a b l e s t r e a m . T r a n s f o r m s t r e a m . D u p l e x v a r R e a d a b l e = r e q u i r e ( ' s t r e a m ' ) . R e a d a b l e ; v a r r s = n e w R e a d a b l e ; r s . p u s h ( ' b e e p ' ) ; r s . p u s h ( ' b o o p \ n ' ) ; r s . p u s h ( n u l l ) ; r s . p i p e ( p r o c e s s . s t d o u t ) ; Streams over any type: Buffers, numbers, functions, objects Objects: add meta data 18 / 46
19. Virtual files Vinyl Objects v a r F i l e = r e q u i r e ( ' v i n y l ' ) ; v a r c o f f e e F i l e = n e w F i l e ( { c w d : " / " , b a s e : " / t e s t / " , p a t h : " / t e s t / f i l e . c o f f e e " , c o n t e n t s : n e w B u f f e r ( " t e s t = 1 2 3 " ) } ) ; 19 / 46
20. Vinyl Adapter (see https://medium.com/@contrahacks/gulp-3828e8126466) g u l p . s r c g u l p . d e s t g u l p . w a t c h s r c : : G l o b - > S t r e a m V F S d e s t : : P a t h - > S t r e a m V F S - > S t r e a m V F S w a t c h : : G l o b - > S t r e a m V F S https://github.com/wearefractal/vinyl-fs 20 / 46
21. Example adapters https://www.npmjs.com/search?q=vinyl vinyl-github-src vinyl-phantomic vinyl-evernote gulp-vinyl-zip 21 / 46
22. Defining tasks g u l p . t a s k ( n a m e , [ d e p s ] , f n ) g u l p . t a s k ( ' d e f a u l t ' , [ ' b u i l d ' ] , f u n c t i o n ( / * c b * / ) { r e t u r n / * s t r e a m | p r o m i s e | r x j s . . . * / } ) ; 22 / 46
23. Dependencies g u l p . t a s k ( ' w a t c h ' , [ ' b u i l d ' ] , f u n c t i o n ( ) { g u l p . w a t c h ( ' s r c / j s / * * / * . j s ' , [ ' s c r i p t s ' ] ) ; g u l p . w a t c h ( ' s r c / c s s / * . s a s s ' , [ ' s t y l e ' ] ) ; } ) ; 23 / 46
24. Reading, writing files g u l p . t a s k ( ' c o p y ' , f u n c t i o n ( ) { r e t u r n g u l p . s r c ( ' s r c / * * / * . j s ' ) / / . p i p e ( . . . . ) / / . p i p e ( . . . . ) / / . p i p e ( . . . . ) . p i p e ( g u l p . d e s t ( ' d i s t / ' ) ) } ) ; 24 / 46
25. Reading, writing files g u l p . t a s k ( ' c o p y ' , f u n c t i o n ( ) { r e t u r n g u l p . s r c ( ' s r c / * * / * . j s ' ) . p i p e ( g u l p . d e s t ( ' d i s t / ' ) ) } ) ; Moar serious: g u l p . t a s k ( ' s c r i p t s ' , f u n c t i o n ( ) { r e t u r n g u l p . s r c ( ' s r c / * * / * . j s ' ) . p i p e ( $ . c o n c a t ( ' n a m e . j s ' ) ) . p i p e ( g u l p . d e s t ( ' d i s t / ' ) ) . p i p e ( $ . m i n i f y ( ) ) . p i p e ( $ . r e n a m e ( ' n a m e . m i n . j s ' ) ) . p i p e ( g u l p . d e s t ( ' d i s t / ' ) ) ; } ) ; 25 / 46
26. Gulp-map v a r $ = r e q u i r e ( ' g u l p - l o a d - p l u g i n s ' ) ; v a r Q = r e q u i r e ( ' k e w ' ) ; / / . . . . p i p e ( $ . m a p ( f u n c t i o n ( f i l e ) { r e t u r n Q . d e l a y ( 5 0 0 ) . t h e n ( f u n c t i o n ( ) { f i l e . t a g s = ( f i l e . t a g s | | [ ] ) . p u s h ( ' s l o w ' ) ; r e t u r n f i l e ; } ) ; } ) ) When you return undefined from your promise or regular function, the file is filtered from the stream. . p i p e ( $ . m a p ( f u n c t i o n ( f i l e ) { i f ( f i l e . p a t h . m a t c h ( / g u l p f i l e \ . j s / ) ) r e t u r n f i l e ; / / o t h e r f i l e s n o t e m i t t e d } ) ) 26 / 46
27. Gulp-map alternatives v a r m a p = r e q u i r e ( ' m a p - s t r e a m ' ) ; / / . . . . p i p e ( m a p ( f u n c t i o n ( f i l e , d o n e ) { d o n e ( n u l l , f i l e ) ; } ) ) 27 / 46
28. Gulp-filetree github 28 / 46
29. Gulp static site j s i t e - 2 0 1 5 29 / 46
30. Compositionality 30 / 46
31. Type theory 31 / 46
32. Why mathematics? what is a class? functions? types? 32 / 46
33. PureScript is a small strongly, statically typed compile-to-JS language with a number of interesting features, such as: Type Inference Higher Kinded Polymorphism Support for basic Javascript types Extensible records Extensible effects Optimizer rules for generation of efficient Javascript Pattern matching Simple FFI Modules Rank N Types Do Notation Tail-call elimination Type Classes 33 / 46
34. PureScript is a small strongly, statically typed compile-to-JS language with a number of interesting features, such as: 이며, 곡들의 컨 셉트에서부터 후반 작업에까지 관여한 의욕적인 품으로 총 10개 의 곡이 수록되어 었다. 흔히 “ 나카모리 아키 나 최대의 문제 작” 이라 부르 기도 하는데, 기획 단계 품으로 총 10개 의 곡이 수록되어 었다. 흔히 “ 나카모리 아키 34 / 46
35. The streaming build system. http://gulpjs.com | https://github.com/gulpjs/gulp (11,803 *'s) 35 / 46
36. What just happened Python " * " * 1 1 8 0 3 JS A r r a y ( 1 1 8 0 3 ) . j o i n ( " * " ) Purescript f o l d l ( + + ) m e m p t y $ m a p ( c o n s t " * " ) $ r a n g e 0 1 1 8 0 2 36 / 46
37. Prelude Rest? Libraries! 37 / 46
38. l o d a s h u n d e r s c o r e l a z y . j s h i g h l a n d . j s versus Prelude 38 / 46
39. c l a s s S e m i g r o u p a w h e r e ( < > ) : : a - > a - > a x < > ( y < > z ) = ( x < > y ) < > z scala 39 / 46
40. f o r e i g n i m p o r t c o n c a t S t r i n g " " " f u n c t i o n c o n c a t S t r i n g ( s 1 ) { r e t u r n f u n c t i o n ( s 2 ) { r e t u r n s 1 + s 2 ; / / < ~ m e a t } ; } " " " : : S t r i n g - > S t r i n g - > S t r i n g Alternatively use e a s y - f f i f o o : : S t r i n g - > S t r i n g - > S t r i n g f o o = u n s a f e F o r e i g n F u n c t i o n [ " s 1 " , " s 2 " ] " s 1 + s 2 " 40 / 46
41. f o r e i g n i m p o r t c o n c a t S t r i n g " " " f u n c t i o n c o n c a t S t r i n g ( s 1 ) { r e t u r n f u n c t i o n ( s 2 ) { r e t u r n s 1 + s 2 ; } ; } " " " : : S t r i n g - > S t r i n g - > S t r i n g i n s t a n c e s e m i g r o u p S t r i n g : : S e m i g r o u p S t r i n g w h e r e ( < > ) = c o n c a t S t r i n g i n s t a n c e s e m i g r o u p A r r : : ( S e m i g r o u p s ' ) = > S e m i g r o u p ( s - > s ' ) w h e r e ( < > ) f g = \ x - > f x < > g x 41 / 46
42. i n f i x r 5 + + ( + + ) : : f o r a l l s . ( S e m i g r o u p s ) = > s - > s - > s ( + + ) = ( < > ) 42 / 46
43. Monoid ( - | - ) c a t 43 / 46
44. Monoid example https://github.com/purescript/purescript-monoid r e p e a t : : f o r a l l m . ( M o n o i d m ) = > m - > N u m b e r - > m then r e p e a t 0 _ = m e m p t y r e p e a t n x = x < > r e p e a t ( n - 1 ) x 44 / 46
45. Conclusion 45 / 46
46. Questions? @ s t a t e b o x 46 / 46