Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Frontend Web Development in 2021+

Frontend Web Development in 2021+

Arnelle Balane

April 24, 2021
Tweet

More Decks by Arnelle Balane

Other Decks in Technology

Transcript

  1. Arnelle Balane Tech Lead @ Newlogic Google Developers Expert for

    Web Technologies @arnellebalane UncaughtException @uncaughtxcptn Subscribe to our channel! /UncaughtException
  2. • Synchronous, designed for server environments • Doesn’t natively work

    on browsers • Doesn’t work too well with static analysis tools Clearing away legacy assumptions Reliance on CommonJS
  3. • Works on both server and browser environments • Works

    well with static analysis tools, tree-shakeable Moving to ES Modules
  4. • “You should be able to use a bundler because

    you want to, and not because you need to” • Provides unbundled ES Modules that run in the browser • Streaming imports: convert bare imports into CDN imports from Skypack Snowpack
  5. • Uses native primitives of the Web platform • Relies

    on packages being compatible with native ES Modules • Streaming imports: safely import packages from npm or Skypack without installation wmr
  6. Pros in using JS • Easier to contribute to projects

    • Rich ecosystem Clearing away legacy assumptions JS tools must be written in JS Pros in using non-JS • Compile to native binaries • Usually faster
  7. • Bundler and minifier written in Go • 10x -

    100x faster than JS-based tools
  8. The Third Age Collapsing layers of tooling One thing doing

    many things well, instead of many things doing one thing well
  9. Frontend Decision Fatigue • Animations • Testing • Linting •

    Code formatting • Bundling • Frontend framework / library • Client side routing • State management • Form management • Data fetching • Styling
  10. • Whole new runtime • Comes with TypeScript support, linting,

    formatting, testing, bundling, and a standard library out of the box Deno
  11. • Designed to replace Babel, ESLint, webpack, Prettier, Jest, etc.

    • Bundling, compiling, docs generation, formatting, linting, minification, testing, type checking, etc. Rome
  12. Web Development in 2021 and beyond • Faster tools •

    Better DX and UX • ES Modules-first • Collapsed layers • More secure