Declarative programming - Fun Fun Function

💖 Support the show by becoming a Patreon
/ funfunfunction
Today, we’re going to explore the power of declarative programming, which React has managed to popularize, and it’s incredibly useful and important for almost all programmers. Don’t worry if you’re not a web developer, this episode is not web specific, and there is not going to be much code in this episode, and I’m not going to assume that you know what React is.
🔗 mpj on Twitter
/ mpjme
💛 Follow on Twitch and support by becoming a Subscriber
We record the show live Mondays 7 AM PT
/ funfunfunction
💛 Fun Fun Forum
Private discussion forum with other viewers in between shows. www.funfunforum.com. Available to patron members, become one at / funfunfunction
💛 mpj on Twitter
/ mpjme
💛 CircleCI (Show sponsor)
Robust and sleek Docker-based Continuous Integration as a service. I used CircleCI prior to them becoming a sponsor and I love that their free tier is powerful enough for small personal projects, even if they are private. Use this link when you sign up to let them know you came from here:
circleci.funfunfunction.com
💛 Quokka (Show sponsor)
Wonder how MPJ evaluates JavaScript inline his editor. Quokka is the answer - use this link when you buy to let them know you came from here:
quokka.funfunfunction.com
💛 FUN FUN FUNCTION
Since 2015, Fun Fun Function (FFF) is one of the longest running weekly KZbin shows on programming 🏅 thanks to its consistency and quality reaching 200,000+ developers.
🤦‍♂️ The Failing Together concept is what makes FFF unique. Most coding content out there focus on step-by-step tutorials. We think tutorials are too far removed from what everyday development is like. Instead, FFF has created a completely new learning environment where we grow from failure, by solving problems while intensively interacting with a live audience.
Tutorials try to solve a problem. Failing Together makes you grow as a developer and coworker.
📹 Each show is recorded live on Twitch in a 2-hour livestream on Mondays. The host, assisted by the audience, is tasked to complete a programming challenge by an expert guest. Like in the real world, we often fail, and learn from it. This, of course, reflects what the audience identifies with, and is one of the most praised aspects of the show.
⏯ On Fridays, an edited version of the show is adapted for and published on KZbin.
Content Topics revolve around: JavaScript, Functional Programming, Software Architecture, Quality Processes, Developer Career and Health, Team Collaboration, Software Development, Project Management

[@gonzalowaszczuk638]

Declarative vs imperative basically boils down to operational semantics vs denotational semantics. It's pretty cool to learn about, since you also learn about how interpreters and compilers work, and ultimately how programs work. It boils down to this: Your code uses a certain domain, which is the one you program with and think about in your head. In the browser, that model would be the view, the buttons, text, forms, etc shown to the user, etc. However, your code doesn't run magically with buttons and forms, it runs on a lower abstraction or machine. In the browser, that abstraction is indeed the DOM, but also the rendering engine, the ECMASCript engine, etc. Imperative programming, just like operational semantics, make use of these machines and operate on them directly. You operate with the DOM directly, or use imperative javascript directly for your browser to execute, etc. If you were writing lower-level stuff, you'd access memory addresses directly, move pointers around the memory, maybe even access specific CPU registers, etc. With declarative programming, your program is just an expression that you then translate towards your model, which is abstract and more mathematical in nature. With the browser, you'd define a language that you then translate into buttons, forms, sections of screen visible at times and at others not, etc. React.js would fall under this. Declarative programming has the benefit of directly working with your domain or model, thus making programming with it easier, since you just program within the domain ("I want a button here, some inputs over there, a textarea over here, etc"). But it can't be executed or computed anywhere without an underlying engine or machine (it's just symbols and paper before that). At that point you do need to translate it into the underlying machine (e.g render it onto the DOM), and that's where the problems arise, like you've stated (DOM manipulation being slow, etc)

[@funfunfunction]

+Gonzalo Waszczuk great write up!!!

[@fadhilh3931]

idk what ur talking about but it sound smart

[@gonzalowaszczuk638]

@@fadhilh3931 You want to program thinking about abstract concepts, but the program runs on a specific machine with bits and instructions and stuff. Declarative programming allows you to only focus on the abstract concepts without worrying about how it's executed (but you get the downside that you don't control how it's executed, there may be performance issues or bugs you can't really control). Imperative/operational programming allows you to focus on how the program executes on that machine (with the downside that you can't really think about the abstract concepts anymore, you have to constantly map between those concepts and bytes, integers, arrays, etc, and this can introduce bugs, create unmaintainable programs, etc)

[@damuz_yt]

"I'm not going to asume you know anything about react" 5 seconds later straight asks what are your thoughts on react haha :p

[@funfunfunction]

:) haha yeah, it's tricky with multiple audiences.

[@KristerSvanlund]

I don't know shit about react but I still have feelings about it! I'm a man on the internet, this is what we do! ;P

[@MikevanKuik]

Asking a reaction to React... pun intended? :p (I have no feelings about React at all. Never played with it.)

[@funfunfunction]

I love you

[@DylanCurzon]

the music at the end was so subtle at first i checked my phone to see if it was ringing with this strange new ringtone

[@josephhicklin7313]

Been using React, Redux and RxJS for about 6 months. Things I love: Composability allowing for more readable "endpoint functions", and immutability making the debugging process more precise with less of me guessing random interactions that I think might be happening. Things I less than love: Having to layer everything I do, forcing me to bounce around to multiple places just to build one thing. It's wonderful to write those "endpoint functions" that are super simple and pretty, but the footwork can be a pain. Overall, I prefer to use React and I really enjoy the assuredness I get from finishing a component that has been completely hooked up through Redux and RxJS.

[@m13m]

what's composability? what's endpoint functions?

[@josephhicklin7313]

Composability is the difference between just writing a sentence, and writing a sentence while having to follow every word with the following info: (Is it a verb, noun or adjective? What's the country of origin? What parts of speech can it be used in? etc...) In coding composing code is essentially using functions that perform all of these steps for you, allowing you to just write the "word" (function call) itself. It makes things much easier to see what's being done because instead of looking at potentially dozens of lines of complex code, you can just read: thisThing.sendToDb(thatThing) Which is way easier to read. "Endpoint functions" are a term that I use (hence why they're in quotes because it's just something I say) to describe these function calls that are composed together. I call them endpoint functions because they are the thing you are reading, and others are reading to see what is happening at that point in your application. I could call them "sentence functions" as well, but that doesn't sound as techy. :P

[@hajimeyamasakivukelic7235]

You might get a kick out of Cycle.js. It's not perfect (is anything new and shiny ever perfect?) but it does take unidirectional data flow to a whole new level. Input -> processing -> output... all the way.

[@dimitri9502]

Just do a REACT series already. I really liked your functional programming series and I would absolutely love some react episodes from you. I'm gonna start a new fresh big project in REACT as a Lead dev and i know that this will be very helpful.

[@omarchehab98]

Oh myy... Thank you for this episode! For so long I have had the appreciation of declarative programming because it allows for less bugs. I just didn't know it had a name!

[@webkoros]

Another example of declarative programming is SQL. This language doesn't get the credit it deserves. It's a standardized, declarative language. If all languages were like this, our life would be much easier.

[@jahilkhalfe]

I was skeptical at first, but as time went by I started to Digg it and as more time goes by find myself digging it even more. React is Great. I would also say by using react you will improve your JavaScript skills in general. In general I find people who hate on React did not really take the time to get to know it better.

[@igordlinni]

I'm learning React for a couple of weeks only. It was really confusing at the beginning, and even now I'm still trying to find correct way to connect React client app with server through socket.io, but it's, as I may see, having a huge advantages, and I had a lot of fun working with it already. Like it!

[@rja421]

I have built quite a few projects using React, Redux, Reselect and Immutable JS. I love it, it provides a superb structure to your app.

[@rebornreaper194]

Interesting to hear discussion on declarative programming in the frame of React. In learning about it from a Java standpoint, I've always heard it as "declarative tells *what* you want to do, and imperative tells *how* to do it." Which then leads you toward functional programming (and often Streams in Java). Great vid as always. :)

[@desmondmc]

Great video MPJ. For what it's worth, i'm an iOS developer and I still find these videos really relevant and helpful. So thanks for keeping the content general enough to apply to other types of frontend devs.

[@itsMapleLeaf]

I used to like react a lot, and I still do. It's a fantastic library. Nowadays i'm more of a Vue.js fan. A lot less mental overhead to get the same thing done while still being scalable. I like to think of it as what angular should have been.

[@mikepayne3069]

This is great, thank you. I always feel better getting into a new library via it's fundamentals, why it was created in the first place, why it's different. Easy to get sucked into the detail and end up using it in the wrong way.

[@jasonhaze5349]

I'm just getting up to speed on React but so far I love it. Really makes managing state way easier, and it was super fast for me to learn, which is not something I could say about Angular 1.3. React seems like a really well scoped tool.

[@vincentchollet5306]

Great video as always, full of energy, it has almost replaced my morning coffee of mondays :-) I came from Angular(1&2) and discovered React since 4 monthes, and the HUUUUUGE advantage of React over all MVC framework for me was : REACT IS JS-CENTRIC What does it mean? No more "loops" in HTML with mutant tags like and all its friends. In ReactJS, the view is written in standard HTML, and the control is done in javascript. so Simple and no "specific" tags to learn.

[@keithlamontdavis8047]

Vincent Chollet Wish I could upvote this 1,000x

[@MapMavericks]

This is the description of React that I've been wanting to read for months. Angular 1 dev here.

[@rckd5903]

className attribute is non-standard

[@RyanMcGuire]

debounce is also used to make sure a user doesn't misclick twice. It's not just optimization.

[@MaffBridges]

I was writing some VueJS for a project at work yesterday, after spending months working with AngularJS. I came in thinking i'd just be able to smush something together the same way I do in angular, however now I see this video, I understand that I've been using a declarative framework. Now I know what I need to read up on, thanks! :)

[@dmh20002]

Going from Angular to React was a revelation. The thing I liked most was that it was very clear how to structure the application.

[@mutebg]

I did have same initial feeling about React 2y ago, but now I love it

[@joaopedros.h.7480]

I'm practicing my english watching your videos without subtitles! When I can understand everything, I guess It's time to try to find a job abroad. It's very funny to practice with a subject I like!

[@wh33lers]

I am just using RxJS / RxStore with angular2 / ionic 2 framework. I totally like that I am forced into a specific structur, but needed some time to get my head around it. Especially nesting reducers was kind of tricky. But as of today this project is my best tested project because it is so easy to write tests for reducers. In the angular2 framework you don't even have the rerendering issue. The only overhead is the immutable state that gets recreated every time. But it doesn't seem to bother my application yet witch is kind of large already.

[@konstantinnesterov6165]

I also enjoy when I can write declarative code. But I have to totally trust the tool/language in this case: if there is a risk that my implementation won't be valid due to performance issues or bugs, which I can't overcome as easily as I do with imperative approach I simply won't use it. Also there is extra risk for you as an employee when you choose an uncommon tool. If you make a slow product in Java you may get away blaming Java for being slow, people are used to it. If you choose a declarative language or a fancy tool to save your effort and write a slow product - your manager will blame you for not choosing an old-good-imperative-way-everybody-expected-from-you-to-choose-and-other-guys-can-help-you-with and your career of somewhat mediocre-but-stable-developer will be broken :)

[@ProgramArtist]

The first time I met declarative programming was a few years ago when I switched from developing WinForms to WPF. I wondered why it took them so long to go that path when the HTML already existed. You can see the HTML as the simplest declarative programming as well and compare it to building your whole page with JavaScript.

[@JonMears]

I've been using React, Redux and Meteor for the last six months, I really like React, it took me a while to get it!

[@alexfoobar]

I've started with React two weeks ago and I like it. I'm just learning it cause I don't have much time for it so i'm going very slowly. Now I'm just discovering different ways to style the components having a css file for each component. To start working with it I was looking first how to use webpack and babel to know a bit more how to have React working without the use of create-react-app PS: I like your watch :D

[@alexford1337]

I don't think React ever diffs with the native DOM. I do believe it creates a new v-dom on update, diffs with the old one, and then patches the native DOM with the diffs.

[@CheenoTheRedstoner]

One of the best explanations of react and declarative programming i've seen, thank you

[@markp8263]

I haven't really tried declarative programming yet so this whole comment could be completely wrong. I do see how mapping object behavior to state makes sense, and have used state based patterns. I however prefer the event based pattern (imperative?). In the example of a payment screen, I can setup dom object to listen for specific events and have then make changes accordingly. I find this easier to reason about. for example a progress bar, has a simple piece of code that basically says when a 'payment' event is triggered, display and animate. When a 'complete' event is triggered hide. When your looking at a specific object you can very easily tell how it will function and interact. This way A causes B, instead of A changes the state, which then causes B. I think it also makes it much easier to reason about object you didn't make (or forgot how they work). A basic HTML button has a click event, I listen to it and it passes needed info. If the HTML button changes a state, how would the state change, it would be different in every screen and you have to write code to deal with this. However if your view has hundreds of events then useing a state system would make much more sense because that can get confusing (or you should't have hundreds of different types of event).

[@ryanbach937]

React was an interesting learning experience. I wouldn't say it was very enjoyable to learn to start, but once I got the hang of it I found that my first thought when starting a project was whether using React would be practical or not.

[@greysontyrud]

On React: My brother swears by it, but I haven't had the chance to get in to it very var. Angular made my life easier but I've not seen much on how to connect React view to the state controller. My brother has shown me examples of code and has shown me a chrome plugin that allows you to view state history, rewind and even copy past states. That seems so damn powerful that I am still looking into it. If only I had the time. On the vid: Really helpful in bridging gaps in my knowledge. I have a few more terms to search for when I learn React

[@funfunfunction]

What he has showed you is Redux. Wes Bos has excellent courses on that that I recommend.

[@DylanMatthewTurner]

I'm an electrical engineering student, and recently I've wanted to bring back analog computing. I've been thinking quite a long time about it, but I realized I (and those who came before me) had failed analog because we tried to make it work like digital. There were a few times it worked-ish, but digital quickly overtook it. I think using signal processing, AC, and a physical declarative-paradigm based processor, I think we can make analog computing work

[@hristoboqnov3380]

Thank you for the video. This helped me understand React more clearly now.

[@boomer5015]

I think React is good for beginner/intermediate JS developers (like myself). It teaches you good starter principles and concepts. It brings alot of things together nicely: Component life cycles, the state and props flow, binding events to instances, redux state flow allowing for global and local component state, and simply declaring prop types. Through share scale, it's easier to debug due to availability of examples, tutorials, snippets and stack overflow answers. It also introduces functional programming, non mutating state, pure functions, side effects, normalise/denormalise, destructuring....canon fodder for pros but not noobs. Also happens to touch on alot of the concepts u cover.

[@leonk6950]

I really haven't played with react much, but I really like the approach of jsx and components. It makes coding react really fun, and easy to get into. I tried angular once, but I was thrown off immediately by the complex folder structure that the angular cli generates, and how I needed to put new lines in 5 different files if I wanted to add a new view. React is really simple in the beginning, and it allows you to do things your way if you want to. I love that. If I just want to build like a two-screen spa, I don't need to learn complex routing and Viewmanagement stuff, I can just put an if statement into my app component and display the correct view component. While this might be not best practice for large scale applications, it's super easy to do. I love that react is in essence a small system for rendering the Dom, that can be set up and used in minutes, but can also scale into huge, complex systems. The main advantage is that it doesn't NEED to be that way. Also people that say "react is harder to learn because you need to learn a new language, jsx" are stupid. Jsx is just syntactic sugar for a bunch of document.createElement's, and it's really just html-blocks that are handled as everything else in js, as objects. It's not more complex than a string literal "hello, world". It's just a way of directly describing how an object should look. vue's and angular's way of needing seperate templates that you then fill with data in js is a lot more complex i feel

[@williamthomas8087]

Started with Angular 1.5 and then went to React. Hated it at first, and then after getting to grips with it I loved it.

[@SPCPerez19Delta]

Finally! Someone knowledgeable that's extremely fun to watch and listen to! Keep up the great work!

[@DrempDK]

From what you describe, I use Imperative programming. I am trying to get into react, and I thought it would be really cool if you could do an episode on how to structure the state I'm React and getting that nice flow that you are talking about, because it seems like my brain tries to use imperative programming with react, which seems a bit confusing.

[@Powerslacker]

Just getting started with React. The component structure is very nice. I think it makes my entire frontend code a lot cleaner and easier to maintain. Also gets rid of 'div soup' - which is awesome! I think React's isn't as popular as it could be because it makes libraries like jQuery and preprocessors a whole lot less useful, which means *gasp* writing your own code for things like animations, injecting css as needed, and having to actually think about the structure of your app instead of just hacking things together. Great video as usual :)

[@eBragaParah]

Been used Elm for some weeks and I loved the functional way of to do the things work. I've also enjoyed the ore-direct flow. And also, the reusability and the readability are great! React is pretty similar to Elm, If I'm not wrong, React was based on Elm way :) Great video.

[@lordcdubs]

So I've been doing React on and off for a couple of years and full time over the past 12 months. I went from really disliking the mixing of JSX and JS to enjoying the modular approach it brings. I love the whole declarative approach "my state looks like this, therefore the browser DOM will look like this", however one growing pain I'm finding at the moment is the levels of abstraction and how data is transformed between state to view (this is mostly a redux/flux teething problem) e.g. - Redux Action: Requests some data that has a 'date' property - API: Returns a date object - Redux Reducer: Sets the raw date object in Redux State - Redux State: Holds the data and the date in raw format - Higher Order Component: Needs to render four child components - Child React component: Needs to render the date as '10/03/2017' - Second Child Component: Needs to render the date as '10th March Twenty Seventeen' - Third Child Component: Needs to render 'three days ago' - Fourth Child Component: Needs to render a red '-' to indicate the date was in the past. Those last five bullet points have confused me as to how and where each piece should be done (should they be done inside the component or should components be dumb and render only what's given as props?). I like how non-prescriptive React is but at the same time, I find it all too easy to end up writing complexity at the wrong layer of this declarative flow. ps. your videos over the past couple of months have been far too coincidental with my current conundrums! so thanks very much!

[@ncubica]

React has changed the way I code UI, is simply beautiful.

[@TheVeselignome]

I fell in love with React at first sight :) Application context, single data binding, composition, Redux... What's not to like :)

[@mahidharc4866]

Great video! I have worked on medium sized CRM dashboard for my company, and used a React front-end with Firebase as the back-end/database. It actually worked very well for the first few months. But then slowly I noticed performance problems, mainly from the Firebase side rather than the React side. Also Firebase has a lot of missing features, like adding even the most basic back-end logic. Not to mention the extremely naive querying capabilities. But overall, it's actually a very good set of tools to start off with, and you can actually get a lot of mileage, before you're forced to introduce a small backend to keep up with feature requests. But I completely agree with your thoughts about declarative programming being one of the most clear and straightforward way to code. It really does help you keep your code maintainable, and the unidirectional data flow ensures that there are very little surprises. There a a few corner cases where you have to break this rule of thumb, but it's maybe 3 places in your whole codebase. So if something goes wrong, you know exactly where to start troubleshooting.

[@hh83917]

Hated React when I started 6 months ago, especially Redux... But, I found myself liking it more and more and learn a lot of core javascript and functional methods along the way. I came from Angular 1 so React got me really confused and verbose at first, now I can appreciate the fact that having to know what each part of the code and there's no magic behind what the code is doing. VueJS, I haven't played with, but from looking at the docs, the tags seems similar to Angular's directives and with components like React. Should give it a try soon.

[@Toujimon]

Nice episode, pal. I've been using react for about 1 year and I really liek it to build, at least, cool responsive components when needed. I was pretty naive at first and made the terrible mistake of trying to make EVERYTHING fit as a React Component, which made me think it was a pain to use it, but when my mind got the real intention of the library, it has really make me simpler to do a lot of things.

[@cthutu]

Declarative programming is not the mapping of state to view. It's more general than that. It's basically the declaration of the final state, irregardless of current state. The 'system' should figure out to mutate current state to final state automatically. This differs from imperative programming where you state the steps from to get from state A to state B. But if your starting state is not state A (due to a bug or change in a feature etc.) your imperative code is now buggy as you will not necessarily get from your new starting state to state B.

[@stevepascoe]

Been using React for a long time now. Still have no idea if i'm using it "correctly" plus my Redux store functions get massive handling all the data flying by. React is a big free for all. Been playing with Vue recently and am loving the fact that the experience is a little more "guided".

[@Ultriix]

Have you had a look at VueJS? It shares a lot with React but doesnt have so many demands on code structure or modules unless you want to of coarse, you can simply import the runtime in a script tag and have a go using your existing html like you would jquery.

[@rckd5903]

This approach doesn't scale at all, so why would you ever build a web app without a bundler?

[@joel_ricci]

I'm very interested in this topic, but without some hands on example it gets very abstract and fuzzy. Would love to see some concrete examples of declarative programming. As always thanks for doing great videos and topics!

[@keff_cb]

I haven't done React, but I've done other declarative programming things, and I think its really intuitive and simple to reason about as you've said, but I think you really need a good base of how things work, otherwise I feel like it can be quite confusing. But for someone that has a good base, I think is wonderful stuff, that can save you a lot of time and headaches. After this i think I'm going to give React a try!

[@trevorwaddell7392]

I've worked with react, and I heavily agree what you mentioned in the video. The big selling point for me is React's simplicity. Components with props and/or state.

[@uhl7792]

My state of mind about react is in flux. I think an immutable opinion causes people to dispatch actions that they might regret in certain situations.

[@jefftrueblood5623]

Great video. From what you describe, the design pattern of React seems to be the same pattern used in ASP.NET WebForms, i.e. declarative view (.aspx) and a code behind (.cs) which handles business logic and data access. However, people seemed to migrate away from that pattern in favor for MVC then MVVM, and now come full circle with React.

[@ralexand56]

Not really. Business logic is usually relegated to something like redux. An optimal react app would ideally just render props passed to it to html elements.

[@harrypehkonen]

I have briefly looked into React. I am into small applications, but really like some of the concepts that React implements or supports, like immutable data with Redux. I have adopted Vue.js 2 as my view library, and have been really happy with it. Maybe one day I will learn React.

[@lenaggar]

What I think about React: I absolutely love it .. I love how JavaScript-centered it is, I love the ability to compose things, and I absolutely love debugging React... What I really don't like is all the configuration and setup you need to do

[@leonk6950]

Have you ever used angular? React is just "create-react-app " and you're done. Just add stuff to your main js file. Nothing to set up.... Or am I missing something?

[@devlad]

Same as you on React. The conceptual extensions to it are more interesting to me, especially combining it with Rx.js

[@leandrogoncalvesdeoliveira9201]

I read that declarative programming is about 'what to do', while imperative programming is about 'how to to'; and SQL is a great example of declarative programming.

[@apbesieged]

I want to like React. It seems like this hip new technology that all the cool kids are going on about. My problem is with it's complexity. If you go through the react tutorial, it all seems pretty straight forward. I made a simple app, wired things together. Everything went well. The problem is when the app isn't so simple and you start looking into how other people use pile layers on top of React to solve it's shortcomings. Webpack, Redux, saga, helmet and a bounty of other dependencies other people use. The learning curve quickly skyrockets. You're not just learning React anymore, you're learn some mashup of a framework, plus all the layers piled on top of it. Some of layers make some drastic changes too. When someone made a jQuery plugin, it added functionality. When someone makes a React plugin, it changes how react works. I've seen a number of people praising Vue. I feel like its going to blow up soon. It does almost everything i want React to do and it's not a headache.

[@jacobsiegel3880]

I absolutely love react. Especially with react native, it is so much easier to build UI's with react than it is with UIKit on iOS.

[@gabinir3591]

Hey, let me first say that your channel is great and that I love watching your videos on Mondays. I don't think Rx is a good example as an optimization library. I get what you mean, debounce can be used for optimizations but it can also be used to implementing things that solely regard user experience and make it easier for you to implement such things than you would without Rx. E.G I can use debounce to pop up an animated gesture every time a user clicks on his keyboard and a certain timespan has passed. If I don't use debounce the gesture will popup too often and the user will have a bad experience. In this case debounce makes it extremely easy to implement this feature. It might also help performance but in this case it is more about user experience.

[@etorsuarez]

Overall Declarative Programming is a total change of mindset, when you are used to Imperative Programming, in my experience with React Native, the learning curve is small and helped me understand much better Imperative Programming and also improve functional Programming. Two birds with one stone.

[@RobertBMenke]

Great video, any thoughts on inferno.js? I would love to see a video on Rx btw!!

[@ivofs]

When I saw React for the 1st time I thought: "I'm doing Angular for such a long time... I don't have time to learn all the things that come together with this new framework (redux, transpilation, etc etc etc)". Now I'm learning all of the "React + new things" and since some time passed there are lots of good content. The framework matured and I don't regret waiting to learn. Only thing missing is doing a serious (production ready) project in React to feel the pains.

[@PlerbyMcFlerb]

Linq's lazy evaluation is another example of optimizing so that you can have your declarative cake and eat it too.

[@FelipeOliveiraCarvalho]

Relational Algebra (SQL, LINQ...) provides many opportunities for automatic optimization. Declare data layout and indices, write your query, and let the query planner do the work.

[@MonstorTapok]

thanks a lot! as always, great video!

[@pdougall1]

btw, Ember also uses a virtual Dom (totally stolen from React) but also only re-renders specific aspects of the DOM that have changed (a nice precision improvement). There is a heavy _convention_ towards declarative (data down, actions up) but it is not really enforced by the framework.

[@mad4zakaria]

haha you love react and it shows dude. the good part is i am going to give react a new chance! keep it up, always waiting a new episode!

[@ahmedraza5340]

Hey MPJ. Love❤️ from pakistan. I have been programming using react since2014. 4 years of experience and im a self taught developer at the age of 17. Today is my first day as a react remote dev at lastingdynamics.com

[@pietrobongiovanni2774]

I have no idea how react works, but I'm planning to get into it sometimes in the next future! In the company I'm interning at it is used for all the front-end stuff and I'd like to know a little bit just to be able to discuss stuff with the front-end guys :)

[@headoverbars8750]

Am an Engineer in autos, last project was Android( via Java)... I had to monitor the "state" of a controller and depending on which have 1 of 25 views to show on the display. I have never done declarative programming before but this sounds like the kind of situation that would shine. I wrote a state machine in Java to listen for changes. if changed, basically looks in a function that maps all of the 25 states to a view with a giant switch statement...I need to see an example of what you mean. this sounds valuable

[@michaelconnor]

Thoughts on Aurelia? I saw Rob Eisenberg's talk from 2016 and was very impressed.

[@AmlethLeMaudit]

How I feel with React? It made me jump from Apache Flex to the JS world. Cool!

[@michaelromanenko]

Great video and an interesting subject. Sad, that you told about declarative programming mostly in context of React. The biggest stumbling block for me with React was handling animations in UI. It is quite natural to describe animation states in a declarative way (all computer games are built this way), but, speaking of DOM and React it is quite hard to implement complex transitions and timeline-like animations. Animated API in ReactNative is quite powerful, but nothing similar exists in the browser world for now.

[@jimmiv2481]

Virtual DOM explained in a few second. Great!

[@emberchord]

Lol your paper is starting to fight back! 02:11

[@bgvianyc]

Rethinkdb + Horizon + React, had this vision of a declarative stack. Would be interesting to talk about how GraphQL & relay take it to the next level.

[@SoumaMondal]

I did a codeschool course on React and I have no idea what I did. The course was very abstract, (which in of itself isn't a problem) but I had difficulty understanding what exactly was going on. React seems like something that has a steep learning curve. It seems like you have to stick with it before that "Aha!" moment occurs (which also isn't a problem).

[@davidkomer9414]

Can you do a talk about functional reactive programming patterns like you hinted at and sortof mentioned here? i.e. maybe comparing "elm architecture", cycle.js, sodium, ...?

[@AaronMartinColby]

While on the subject of virtual DOMs, have you had any new experience with Elm? You talked about it a year ago and I'm wondering if your thoughts have changed.

[@muxahuk1214]

Can we use Declarative programming on the server side ? if yes - how ? and for what tasks ?

[@thelavishcoder2553]

I feel the same way. I used to hate React, but as I use it more and more I'm beginning to like it.

[@tomtakumi]

React + Firebase = New Video Tutorial Idea

[@junkgrave]

Have to agree with everyone spreading the love for Vue. Its architecture is just phenomenal.

[@NckNck-pu9vb]

learning react + redux now. Lots of things to juggle and I have not managed to understand how it all works together yet.

[@thefuecisla]

I havent started yet with React, bu reading the comments I wonder if I should try Vue.js instead. Any thougts on that?

[@GCoda]

thefuecisla try react, get an idea and then use vue

[@ShadiBarghash]

Good watch, nice discussion.. :) Does XAML (design code for Windows Apps) count as Declarative Programming? On that explanation, I assume it is. And, we use MVVM pattern (a.k.a. MVC pattern), to make data binding between the view and properties/fields in the ViewModel class -- so it's like a place to store all states for different elements in the view. To be honest, I am not sure how rendering works, but I assume (and hope) it helps to let Windows re-render only elements bound to the changed state, and not the whole view. Anyway, what I wanted to say is that, in the way I use it, I still use events to get notified about changes, but in a declarative way, that I care and code less about it. Thanks for the video. :)

[@chrisbedowitz9258]

Having started my front end experiences with Angular 2 before moving backwards to do some Angular1 (AngularJS or whatever it's called now), I'm really appreciating React's light weight API. Compared with 100s of Angular directives, I'm guessing all of React is about 30 methods. Of course, it's a totally unfair comparison, but it sure makes getting started learning it much easier.

[@christianhorauf9958]

short ago I started on elm which uses the same pattern that MPJ described here. unfortunately I did not yet understand how I should abstract subcomponents away from the rest of the app, since the messages specific for those subcomponents are defined as the global messages type and I don't see a way to separate them from the rest without breaking the compiler

[@bugkilla84]

Christian Hörauf you can use generic types istead of refering to concrete msg type

[@alexswensen_]

@mpjme Coming from the AngularJS world, I have yet to do much with React, even though in theory you can use Angular and React together. I, for one, am very interested in React, but i haven't gotten the chance to really sit down with it yet.

[@rubenbaden5508]

This channel is great!

[@madimakes]

3:21 I actually don’t fully understand the details just yet but I assume that state change doesn’t happen *only* because the view changed it, but because *_something_* changed the state in father store? (ie the “only• refers to your example, only, right?)

[@alexkey9372]

I kind of had the same thoughts as you in the beginning. Loved angular before, hated react but slowly started liking it. However what I am still missing from angular is some out of the box stuff which in react you have to do manually. e.g ng repeat was convoluted but was really simple. if you knew how to use it properly with track by $index it wouldn't slow down your project. in any case, overall for me the prons of react are: clear structure, easily manipulated components, modular, states and props are really handy, things like redux makes big project easily scalable. cons: horrible when it comes to animation / transitions due to fake dom, no out of the box components like angular, bad for small projects

[@kauePBD]

Well, i use React + Redux as the default stack, and i really love it :)

[@wmhilton-old]

Every time you said "declarative" my brain was anticipating "functional". Yet neither functional purity nor immutability actually came up in this talk. I must ponder the connection between functional and declarative (or as autocorrect would have me type it, fungible and decorative) programming.

[@johnsprunger5224]

MPJ, have you ever thought about doing some proper tutorial videos on JS? I would love to see your take on teaching JS.

[@DouglasWright]

Loving React more and more. Composability, reuse and clean code.

[@DisfigurmentOfUs]

Declarative programming is like writing generalized formulas, not manipulating concrete numbers

[@PaulCristianMartin]

I like react very much, I use clojure/clojurescript with reagent, and it is very intuitive. I need to learn lambda calculus to gain more from my stack :D

[@Arvigeus]

Why am watching this? It’s old, I already know that stuff. Oh, yes - because it’s fun!