Faster Vue.js Execution in Firefox – Mozilla Hacks - the Web developer blog
Speedometer 3 is a cross-industry effort to build a modern browser benchmark rooted in real-world user experiences. Its goal is to focus browser engineering effort towards making the Web more smooth for actual users on actual pages. This is hard to do and most browser benchmarks don’t do it well, but we see it as a unique opportunity to improve responsiveness broadly across the Web. This requires
Audjust - Snappy UIs With WebAssembly and Web Workers
Published: 2023-08-07 Our web app allows users can change the length of a song or find loops present in it for infinite listening, remixing, or for their next next video edit or performance. After uploading a song, there is an initial server-side analysis step after which the audio can be manipulated completely in the browser. Users can alter the desired length or mark sections of audio to prefer
Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev · Discussion #1
chinese version Before embarking on the development of Rspack, we explored various build tools and frameworks, including extensive use of Webpack, Vite, esbuild, and Rollup in real-world production environments. To provide some context, our team, known as the WebInfra Team, is responsible for overseeing the company's suite of front-end build tools and frameworks. Some of these are open-source, whi
14 Linting Rules To Help You Write Asynchronous Code in JavaScript
Debugging asynchronous code in JavaScript can feel like navigating a minefield at times. You don't know when and where the console.logs will print out, and you have no idea how your code is executed. It's hard to correctly structure async code so it executes in the right order as you intend it to. Wouldn't it be nice if you had some guidance while writing asynchronous code, and to get a helpful me
Introducing the scheduler.yield origin trial | Blog | Chrome for Developers
Building websites that respond quickly to user input has been one of the most challenging aspects of web performance—one that the Chrome Team has been working hard to help web developers meet. Just this year, it was announced that the Interaction to Next Paint (INP) metric would graduate from experimental to pending status. It is now poised to replace First Input Delay (FID) as a Core Web Vital in
Patterns for Reactivity with Modern Vanilla JavaScript – Frontend Masters Blog
“Reactivity” is how systems react to changes in data. There are many types of reactivity, but for this article, reactivity is when data changes, you do things. Reactivity Patterns are Core to Web Development We handle a lot with JavaScript in websites and web apps since the browser is an entirely asynchronous environment. We must respond to user inputs, communicate with servers, log, perform, etc.
Deprecating the unload event | Web Platform | Chrome for Developers
All sites deprecation timeline. Note that we also offer a menu of opt-out options in case this deprecation timeline doesn't provide sufficient time to migrate away from unload. Our goal is to use this soft deprecation to inform the timeline for the last phase (hard deprecation of unload) in which these opt-outs will be removed or reduced. Timeline of the unload deprecation. Background unload was d
Things you forgot (or never knew) because of React
Published: August 4, 2023 Updated: October 27, 2023 Part 1: an intro about music, defaults, and bubbles Like a lot of people, there was a time when the only music I listened to was whatever was played on my local radio station. (A lot of people over 30 or so, anyway. If this doesn’t sound familiar to you yet, just stick with me for a minute here.) At the time, I was happy with that. It seemed like
Blogged Answers: My Experience Modernizing Packages to ESM
Random musings on React, Redux, and more, by Redux maintainer Mark "acemarke" Erikson This is a post in the Blogged Answers series. Details on the painful experiences and hard-earned lessons I've learned migrating the Redux packages to ESM Table of Contents 🔗︎ Introduction Redux Packages Background Packages and Configurations Issue History Early Attempts Migrating to Vitest Initial Alpha Testing
Updates to Storage Policy
A website can store data on a user’s device using various storage APIs: localStorage, IndexedDB, File System, etc. It’s an important capability allowing websites to be functional offline with good performance by serving local resources. However, the storage capacity is not unlimited. In fact, it is usually much smaller than a device’s disk size. Bad things could happen when the capacity is full li
A compilation of outstanding testing articles (with JavaScript) | Practica.js
About the sweet and powerful 'use case' code patternA compilation of outstanding testing articles (with JavaScript)Testing the dark scenarios of your Node.js applicationPractica v0.0.6 is aliveIs Prisma better than your 'traditional' ORM?
2023-08-03のJS: Riot.js v9.0.0、Firefox 116、React Server Componentsへの移行
JSer.info #654 - Riot.js v9.0.0がリリースされました。 Release Evergreen · riot/riot このリリースでは、Riot.jsとcompilerなどのバージョンを合わせるため、v8はスキップしてv9.0.0としてリリースされています。 Node.js 14/16のサポート終了、BabelでのTranspileをしないように変更、boolean属性の挙動変更などが含まれています。 Firefox 116がリリースされました。 Firefox 116.0, See All New Features, Updates and Fixes Firefox 116 for developers - Mozilla | MDN HTTP/2のアップロードパフォーマンスの改善、CSP3 external hashesをサポート。 FetchのgetRe
Remote Synthesis | Is Jamstack Officially Finished?
Is Jamstack Officially Finished? Brian Rinaldi | Wednesday, July 26, 2023 Earlier this week, Netlify officially killed The Jamstack Community Discord. It was a rather abrupt end, with little more than a week’s notice. Here’s a portion of the announcement: Over time, we have noticed a decline in activity and engagement within the server. After careful consideration, we have come to the decision to
ServiceWorkerの落とし穴8選 - Repro Tech Blog
はじめに Reproで開発を担当しているEdward Fox (edwardkenfox) です。2021年頃から Repro Booster というプロダクトの立ち上げに携わっており、開発を通して得た知見を共有できればと思い立ち筆を取るに至りました。4年ぶりのテックブログ執筆で少しばかり緊張していますが（？）、張り切ってやっていこうと思います。 Repro Boosterとは 2022年11月に正式リリースした、ウェブサイトの表示速度向上を実現するサービスです。「タグを入れたその日から、Webサイトが速くなる」というタグラインのもと、タグ（JavaScript）の設置だけでウェブサイトの表示速度が簡単に実現できるということで、リリース以来多くのお客様・サイトでご利用いただいています。 Repro BoosterではServiceWorkerと呼ばれる技術を最大限活用して多くの機能が実現さ
URL.canParse
Parsing of URLs on the client side has been a common practice for two decades. The early days included using illegible regular expressions but the JavaScript specification eventually evolved into a new URL method of parsing URLs. While URL is incredibly useful when a valid URL is provided, an invalid string will throw an error -- yikes! A new method, URL.canParse, will soon be available to validat
アニメーションの実装が劇的に簡単になるFLIPテクニック - Katashin .info
2023年7月10日CSS,JavaScript,アニメーション,デザインパターンアニメーションの実装はややこしいからCSS Transitionでできなければ実装したくない、そう思っていませんか？FLIPというテクニックを使うことで、CSS Transitionだけでは実装できないケースでも簡単にアニメーションを実装することができます。 FLIPとは #FLIP とは First, Last, Invert, Play の頭文字から取られた用語であり、アニメーションをこの4つのステップに分割して行うテクニックです。例えば、以下のようなリストの項目に追加、削除、並べかえができるUIに対して、簡単にアニメーションを付けることができます。 上のデモで追加、削除、並べかえを行った時に、項目の座標移動がアニメーションすることがわかると思います。これは CSS Transition だけでは実装する
Breaking Up with SVG-in-JS in 2023
Please don't import SVGs as JSX. It's the most expensive form of sprite sheet: costs a minimum of 3x more than other techniques, and hurts both runtime (rendering) performance and memory usage. This bundle from a popular site is almost 50% SVG icons (250kb), and most are unused. SVGs in JS have a cost and SVGs don’t belong into your JS bundle. It’s about time to bring back SVG-in-HTML. Let’s take
CommonJSからES Modulesへの移行する方法。トップダウンかボトムアップか
Secretlint v7でCommonJS からES Modulesへの移行を行いました。 Secretlint v7.0.0をリリースしました。Pure ESMへの書き直し この記事では、CommonJS(CJS)からES Modules(ESM)への移行を行った経緯と、移行する方法について紹介します。 CJSからESMへの移行は、率直に言えば単調な作業で、メリットが見えにくい作業です。 しかし、将来的にCJSよりもESMが主流になることは間違いないので、移行することは必要です。 移行の作業は、移行方法が決まれば大部分は機械的な書き換えが可能です。 では、実際にどうやって移行したのかを紹介します。 ESMへの移行の影響は依存元へと連鎖する Secretlintのリポジトリはmonorepoになっていて、だいたい40コぐらいのパッケージが含まれています。 そしてパッケージ間で依存関係があ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Protractor Deprecation Update August 2023
Creating a recorder with Document Picture-in-Picture API