Building better in the world of build tools!

  Рет қаралды 20,879

Chrome for Developers

Chrome for Developers

Күн бұрын

Build tools are an integral part of modern web development, making it possible to build great apps that are bandwidth-friendly and delivered as-needed. However, it's surprisingly difficult to choose and configure build tools in a way that produces consistent and good results. We're often forced to make tradeoff decisions in our tooling, which can stand in the way of delivering the best possible applications on the web.
We developed a guide to help you choose tools which are best suited for your next project with example of how to set one up. Come find out how we defined what's the best tool for a job and how we investigated and tested each one.
Resources:
webpack → goo.gle/3eFLmsT
rollup → goo.gle/2ZfQJse
Parcel → goo.gle/3i3Z1fr
Eleventy → goo.gle/2BdWUFh
Gatsby → goo.gle/2Zd1USr
Checkout the website → goo.gle/3eDuvad
Thank you to tooling authors and reviewers for their support in the development of tooling.report!
Related Playlist:
Day 3 → goo.gle/WDL20Day3
Subscribe to the Chrome Developers → goo.gle/ChromeDevs
Speaker:
Mariko Kosaka
#webdevLIVE #webpack event: web.dev LIVE 2020; re_ty: Publish; fullname: Developer, Mariko Kosaka,; product: Chrome - General;

Пікірлер: 17
@MacoveiVlad
@MacoveiVlad 4 жыл бұрын
I guess it is appropriate to share my (limited) experience with bundlers here. I decided to make a small project with Vue and Lumen to play with some new (to me) technologies, build tools among others. Also a major goal was to get as little false errors in VSCode as possible. After switching to TypeScript to help the editor better understand the project the build started failing. I think the problem had something to do with Laravel Mix using a older version of Webpack and not being able to compile the latest TypeScript version. After trying to diagnose and fix this error for several hours I remembered hearing Jake and Surma talking about Parcel and it's ease of use on the HTTP 203 podcast. Switching to Parcel I was able to create a bundle in about two hours. The main difficulty I encountered is that Parcel prefers a html file as the entry point but Lumen does some magic and serves the view from the resources folder, I solved this by passing the main.ts as entry point and routing the output to 'public'. I'm quite pleased with it's ease of use. I guess Parcel had the advantage of learning from the shortcoming of Webpack and other earlier bundlers.
@swyxTV
@swyxTV 4 жыл бұрын
love the animations!
@ih8tusernam3s
@ih8tusernam3s 3 жыл бұрын
I'm glad I'm not the only one that had webpack experience.
@eliteeth4n
@eliteeth4n 4 жыл бұрын
I'm curious how the new kind of build tools like snowpack and vite compare to this list.
@MikaelPorttila
@MikaelPorttila 4 жыл бұрын
Parcel
@johnfridja
@johnfridja 4 жыл бұрын
Sick drum kit @ 5:39
@hngbv951
@hngbv951 3 жыл бұрын
I think the complexity of build tools should be reduce. I mean It just a way to deal with the lack of structure of Js and web assets itself. In the future, I hope we can do it entirely on the web or at least we have a standard way to build it. Currently, the complexity is inevitable as many people said.
@DenisTRUFFAUT
@DenisTRUFFAUT 4 жыл бұрын
Google Cloud Storage says it is better for throughput if the file name starts with the hash (because sharding). Just saying.
@fzcompany4603
@fzcompany4603 4 жыл бұрын
Great 👏👏😍
@kmcat
@kmcat 4 жыл бұрын
What are those graphics Adam has on the wall at 11:15
@yordanbonev9665
@yordanbonev9665 3 жыл бұрын
check out hello.eboy.com/eboy/ i think it's from them
@BrianBest
@BrianBest 3 жыл бұрын
Who remembers Yeomen? good times
@omar99ize
@omar99ize 3 жыл бұрын
Conclusion? Parcel..
@petitslipdubled
@petitslipdubled Жыл бұрын
Anyone using Vite js?
@faosparkNeo
@faosparkNeo 4 жыл бұрын
Complexity is inevitable but dont make it border Chaos. seriously though the plurality of build tools not necessarily a good thing. It is a doubled edged reality
@pajeetsingh
@pajeetsingh 2 жыл бұрын
holy christ!
Cookie recipes - SameSite and beyond
21:27
Chrome for Developers
Рет қаралды 12 М.
Semantic markup - Designing in the Browser
14:38
Chrome for Developers
Рет қаралды 36 М.
Получилось у Вики?😂 #хабибка
00:14
ХАБИБ
Рет қаралды 6 МЛН
Luck Decides My Future Again 🍀🍀🍀 #katebrush #shorts
00:19
Kate Brush
Рет қаралды 8 МЛН
Optimize for Core Web Vitals
38:03
Chrome for Developers
Рет қаралды 153 М.
Image compression deep-dive
31:32
Chrome for Developers
Рет қаралды 53 М.
What’s new in DevTools
22:32
Chrome for Developers
Рет қаралды 12 М.
Cross-origin fetches - HTTP 203
23:42
Chrome for Developers
Рет қаралды 38 М.
Vite Crash Course | Faster Alternative To CRA
16:24
Traversy Media
Рет қаралды 188 М.
Shipping a PWA as an Android app
8:57
Chrome for Developers
Рет қаралды 48 М.
10 modern layouts in 1 line of CSS
21:39
Chrome for Developers
Рет қаралды 1,1 МЛН
Sign-in form best practice
20:20
Chrome for Developers
Рет қаралды 110 М.
The main thread is overworked & underpaid (Chrome Dev Summit 2019)
30:06
Chrome for Developers
Рет қаралды 123 М.
Storage for the web
10:12
Chrome for Developers
Рет қаралды 88 М.
Low Price Best 👌 China Mobile 📱
0:42
Tech Official
Рет қаралды 717 М.
#miniphone
0:16
Miniphone
Рет қаралды 3,6 МЛН
Lid hologram 3d
0:32
LEDG
Рет қаралды 10 МЛН