{"id":332973,"date":"2021-01-18T07:40:32","date_gmt":"2021-01-18T15:40:32","guid":{"rendered":"https:\/\/css-tricks.com\/?p=332973"},"modified":"2021-01-18T07:40:34","modified_gmt":"2021-01-18T15:40:34","slug":"state-of-javascript-2020","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/state-of-javascript-2020\/","title":{"rendered":"State of JavaScript 2020"},"content":{"rendered":"\n<p>We rounded up a bunch of published 2020 annual reports right before the year ended and <a href=\"https:\/\/css-tricks.com\/2020-roundup-of-web-research\/\">compiled them into a big ol&#8217; list<\/a>. The end of the list called out a couple of in-progress surveys, one of which was the 2020 State of JavaScript. <a href=\"https:\/\/css-tricks.com\/2020-roundup-of-web-research\/\">Well, the results are in and available to check out!<\/a><\/p>\n\n\n\n<!--more-->\n\n\n\n<p>Just shy of 24,000 folks participated in this year&#8217;s survey&#8230; almost <em>exactly<\/em> 2,000 more than 2019.<\/p>\n\n\n\n<p>I love charts like this:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2910\" height=\"1558\" src=\"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?resize=2910%2C1558&#038;ssl=1\" alt=\"\" class=\"wp-image-332974\" srcset=\"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?w=2910&amp;ssl=1 2910w, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?resize=300%2C161&amp;ssl=1 300w, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?resize=1024%2C548&amp;ssl=1 1024w, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?resize=768%2C411&amp;ssl=1 768w, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?resize=1536%2C822&amp;ssl=1 1536w, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?resize=2048%2C1096&amp;ssl=1 2048w, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?resize=1000%2C535&amp;ssl=1 1000w\" sizes=\"(min-width: 735px) 864px, 96vw\" data-recalc-dims=\"1\" \/><figcaption>Notice how quickly some technologies take off then start to gain negative opinions, even as the rate of adoption increases.<\/figcaption><\/figure>\n\n\n\n<p>What I like about this particular survey (and the <a href=\"https:\/\/stateofcss.com\" rel=\"noopener\">State of CSS<\/a>) is how the data is readily available to export in addition to all the great and telling charts. That opens up the possibility of creating your own reports and gleaning your own insights. But here&#8217;s what I&#8217;ve found interesting in the short time I&#8217;ve spent looking at it:<\/p>\n\n\n\n<ul><li><strong>React&#8217;s facing negative opinions.<\/strong> It&#8217;s not so much that everybody&#8217;s fleeing from it, but the &#8220;shiny&#8221; factor may be waning (coming in at 88% satisfaction versus a 93% peak in 2017). Is that because it suffers from the same frustration <a href=\"https:\/\/css-tricks.com\/2020-roundup-of-web-research\/#2020-mdn-web-developer-needs-assessment\">that devs expressed with a lack of documentation in other surveys<\/a>? I don&#8217;t know, but the fact that we see both growth <em>and<\/em> a sway toward negative opinions is interesting enough that I&#8217;ll want to see where it goes in 2021.<\/li><li><strong>Awwwww, Gulp, what happened?!<\/strong> Wow, what a change in perception. Its usage has dipped a bit, but the impression of it is now solidly in &#8220;negative opinions&#8221; territory. I still use it personally on a number of projects and it does exactly what I need, but I get that there are better build processes these days that don&#8217;t require writing a bunch of pipes and whatnot.<\/li><li><strong>Hello, Svelte.<\/strong> It&#8217;s the most fourth most used framework (15%) but enjoys the highest level of satisfaction (89%). I&#8217;m already interested in giving it a go, but this makes me want to dive into it even more \u2014 which is consistent with the fact that it also garners the most interest of all frameworks (68%).<\/li><li><strong>Javascript is sorta <a href=\"https:\/\/2020.stateofjs.com\/en-US\/opinions\/js_over_used_online\" rel=\"noopener\">overused<\/a> and sorta <a href=\"https:\/\/2020.stateofjs.com\/en-US\/opinions\/building_js_apps_overly_complex\" rel=\"noopener\">overly complex<\/a>.<\/strong> Well, according to the polls. It&#8217;s just so interesting that the distribution between the opinions is almost perfectly even. At the same time, the vast majority of folks (80.6%) believe JavaScript is heading in the right direction.<\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>We rounded up a bunch of published 2020 annual reports right before the year ended and compiled them into a big ol&#8217; list. The end of the list called out a couple of in-progress surveys, one of which was the 2020 State of JavaScript. Well, the results are in and available to check out!<\/p>\n","protected":false},"author":2508,"featured_media":332974,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[17],"tags":[432,809],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?fit=2910%2C1558&ssl=1","jetpack-related-posts":[{"id":330275,"url":"https:\/\/css-tricks.com\/slow-movement\/","url_meta":{"origin":332973,"position":0},"title":"Slow Movement","date":"December 16, 2020","format":false,"excerpt":"There was a time when I felt overwhelmed by how fast the web developed. It seemed like not a single day passed without a new plugin, framework, technique, or language feature being released. I believed that in order to survive as a freelancer and to compete with others I had\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/12\/Screen-Shot-2020-12-16-at-8.44.34-AM.png?fit=1200%2C550&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":330295,"url":"https:\/\/css-tricks.com\/its-always-year-zero\/","url_meta":{"origin":332973,"position":1},"title":"It\u2019s Always Year Zero","date":"December 15, 2020","format":false,"excerpt":"In the short term, opinions about technology often follow a compressed form of Laver\u2019s Law: Everything just before me was completely broken.Everything that comes after me is completely unnecessary.Everything I use right now is perfectly fine; stop changing things. We tend to judge things based on where we started, our\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/12\/Screen-Shot-2020-12-15-at-5.14.55-PM.png?fit=1200%2C655&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":359146,"url":"https:\/\/css-tricks.com\/links-on-performance-v\/","url_meta":{"origin":332973,"position":2},"title":"Links on Performance V","date":"December 21, 2021","format":false,"excerpt":"Does shadow DOM improve style\u00a0performance? \u2014 Nolan Lawson covers how, because of the inherent encapsulation of the shadow DOM, the styling gets applied a bit faster than it would if those styling rules were relevant to the entire page. But as ever, it depends, and it turns out that classes\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/08\/website-lightning.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":302876,"url":"https:\/\/css-tricks.com\/why-javascript-is-eating-html\/","url_meta":{"origin":332973,"position":3},"title":"Why JavaScript is Eating HTML","date":"February 13, 2020","format":false,"excerpt":"Web development is always changing. One trend in particular has become very popular lately, and it fundamentally goes against the conventional wisdom about how a web page should be made. It is exciting for some but frustrating for others, and the reasons for both are difficult to explain. A web\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/02\/js-pattern.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":339563,"url":"https:\/\/css-tricks.com\/astro\/","url_meta":{"origin":332973,"position":4},"title":"Astro","date":"May 5, 2021","format":false,"excerpt":"You can't even look at code or documentation for Astro (publicly) yet\u2009\u2014\u2009it's an in-progress idea\u2009\u2014\u2009but you can watch a video of Fred showing it off to Feross. I gotta admit: it looks awesome. I'm bullish on two major parts of this: Jamstack is a good idea. Producing static, pre-rendered, minimal\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/05\/astro-homepage.png?fit=1200%2C597&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":316692,"url":"https:\/\/css-tricks.com\/three-css-alternatives-to-javascript-navigation\/","url_meta":{"origin":332973,"position":5},"title":"Three CSS Alternatives to JavaScript Navigation","date":"July 14, 2020","format":false,"excerpt":"Hey quick! You\u2019ve gotta create the navigation for the site and you start working on the mobile behavior. What pattern do you choose? If you\u2019re like most folks, it\u2019s probably the \u201chamburger\u201d menu that, when clicked, uses a little JavaScript to expand a vertical list of navigation links. But that\u2019s\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/01\/hamburger-menu.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]}],"featured_media_src_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/2020-state-js-tech.png?fit=1024%2C548&ssl=1","_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/332973"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/2508"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=332973"}],"version-history":[{"count":10,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/332973\/revisions"}],"predecessor-version":[{"id":333015,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/332973\/revisions\/333015"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media\/332974"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=332973"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=332973"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=332973"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}