GraphQLクライアントにurqlをおすすめしたい
GraphQLのクライアントといえばApollo Clientが使われることが多いと思いますが、urqlというクライアントをおすすめする記事です。 TL;DR urqlのドキュメントキャッシュはApolloみたいなキャッシュ管理が要らなくて楽だからおすすめ ドキュメントキャッシュは、Mutationの __typename を見て汚れたキャッシュを捨てる仕組み Mutationのあと refetchQueries やってるならそれはurqlが自動でやってることと同じ なぜurqlをおすすめするのか この記事ではurqlのドキュメントキャッシュというキャッシュを仕組みだけを紹介します。雑に言うと、Apolloの正規化されたキャッシュより多少効率は落ちるものの煩雑な正規化されたキャッシュの管理から解き放たれるというものです。Apolloのキャッシュの管理に疲れた人にめちゃくちゃおすすめですし、
How to Eliminate Render-Blocking Resources: a Deep Dive
You might be here because Lighthouse told you to "eliminate render-blocking resources". Render-blocking resources are a common hurdle to rendering your page faster. They impact your Web Vitals which now impact your SEO. Slow render times also frustrate your users and can cause them to abandon your page. I worked with one client to reduce their render-blocking resources and improved their site load
Fastly Launches Highly-Secure Serverless JavaScript | Fastly
Why?ProductsServicesSolutionsDevsPartnersResourcesPricing Compute@Edge’s unique isolation sandbox technology enables a fast, secure JavaScript experience as developers continue to enter into the growing serverless computing landscape. SAN FRANCISCO -- JULY 21, 2021 -- Fastly, Inc. (NYSE: FSLY), a global edge cloud platform provider, today announced the availability of JavaScript in Compute@Edge, a
URLPattern brings routing to the web platform | Web Platform | Chrome for Developers
Background Routing is a key piece of every web application. At its heart, routing involves taking a URL, applying some pattern matching or other app-specific logic to it, and then, usually, displaying web content based on the result. Routing might be implemented in a number of ways: it's sometimes code running on a server that maps a path to files on disk, or logic in a single-page app that waits
The Road to Ember 4.0
Contributors to the Ember project have been hard at work since Ember Octane was released in December 2019. Over the duration of a challenging (and sometimes devastating) year and a half, we've shipped a powerful new feature (Named Blocks) and supported an ecosystem shifting to Octane conventions. We've more closely aligned Ember with wider frontend conventions through improved publishing & build t
Image To Text Conversion With React And Tesseract.js (OCR) — Smashing Magazine
Do you have to process data manually because it is served through images or scanned documents? An image-to-text conversion makes it possible to extract text from images to automate the processing of texts on images, videos, and scanned documents. In this article, we look at how to convert an image to text with React and Tesseract.js(OCR), preprocess images, and deal with the limitations of Tessera
Encoding data for POST requests
Right now, when you go to copilot.github.com you're greeted with this example: async function isPositive(text) { const response = await fetch(`http://text-processing.com/api/sentiment/`, { method: 'POST', body: `text=${text}`, headers: { 'Content-Type': 'application/x-www-form-urlencoded', }, }); const json = await response.json(); return json.label === 'pos'; } This is bad and might result in sec
Temporal: getting started with JavaScript’s new date time API
Temporal: getting started with JavaScript’s new date time API Updates: 2022-01-10: Temporal.now was renamed to Temporal.Now. 2021-06-30: Rearranged the content and created a section on the concepts and patterns used by the Temporal API. 2021-06-29: Clarified how Instant uses the ISO-8601 calendar. Listed the properties of some classes. Date, JavaScript’s current date time API is infamously difficu
Demystifying styled-components • Josh W. Comeau
Filed underReactoninJune 21st, 2021.Jun 2021.Last updatedoninJuly 17th, 2025.Jul 2025. When I first started using styled-components, it seemed like magic ✨. Somehow, using an obscure half-string-half-function syntax, the tool was able to take some arbitrary CSS and assign it to a React component, bypassing the CSS selectors we've always used. Like so many devs, I learned how to use styled-componen
ABEMA Web で Polyfill のコードをモダンブラウザ向けに 99% 削減した話 | CyberAgent Developers Blog
これらを踏まえて polyfill-library を使って Polyfill の出し分けをすることが最適解だと確信しました。 Polyfill の出し分けの実装方法 最初に実装したコードの全体像を見せると次の通りになります。それぞれの変数や関数についての説明は後ほどおこないます。 import crypto from "crypto"; import { Response, Request } from "express"; import { getPolyfillString } from "polyfill-library"; import polyfillLibraryPackageJson from "polyfill-library/package.json"; const FEATURES_OPTION = { flags: ["gated"] }; const FEATUR
Securing Your Website With Subresource Integrity | CSS-Tricks
You may have noticed that, for example, Bob and Mary have the same output. For hashing functions, this is called a “collision.” For our example scenario, it inevitably happens. Since we have seven names as inputs and only six possible outputs, we’re guaranteed at least one collision. A notable difference between this example and a hash function in practice is that practical hash functions are typi
Strykerを使ってTypeScriptでMutation Testingする
概要 JavaScript/TypeScript向けのMutation Testing FrameworkであるStryker-jsがいい感じになってきたので紹介してみます。簡単な紹介のみです。 対象読者 Strykerの概要を知りたい人 Mutation Testingよく知らないJSer/TSer Mutation Testing導入したいけどJS/TS用のツールが見つからなかった人 Mutation Testingとは テスト対象のコードを変更(Mutate)するミュータントを仕込み、Unit Testが正しくそれらのミュータントを退治できるか測定するものです。 一般的には退治できた割合が高いほど意味のあるUnit Testを書いていると言えます。 Wikipediaの項目にもある通りFuzzingの一種とも言えます。 Mutation Testing自体はGoogleが論文出してた
Making JavaScript run fast on WebAssembly - Bytecode Alliance
JavaScript in the browser runs many times faster than it did two decades ago. And that happened because the browser vendors spent that time working on intensive performance optimizations. Today, we’re starting work on optimizing JavaScript performance for entirely different environments, where different rules apply. And this is possible because of WebAssembly. We should be clear here—if you’re run
A Thorough Analysis Of CSS-in-JS | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! Wondering what’s even more challenging than choosing a JavaScript framework? You guessed it: choosing a CSS-in-JS solution. Why? Because there are more than 50 libraries out there, each of them offering a unique set of features. We tested 10 different libraries, which are listed here in no p
Tree-Shaking: A Reference Guide — Smashing Magazine
Since its early days, JavaScript programs have grown in complexity and the number of tasks they perform. The need to compartmentalize such tasks into closed scopes of execution became apparent. “Tree-shaking” is a must-have performance optimization when bundling JavaScript. In this article, we dive deeper on how exactly it works and how specs and practice intertwine to make bundles leaner and more
How we use Web Components at GitHub
AI & MLLearn about artificial intelligence and machine learning across the GitHub ecosystem and the wider industry. Generative AILearn how to build with generative AI. GitHub CopilotChange how you work with GitHub Copilot. LLMsEverything developers need to know about LLMs. Machine learningMachine learning tips, tricks, and best practices. How AI code generation worksExplore the capabilities and be
Introducing CloudFront Functions – Run Your Code at the Edge with Low Latency at Any Scale | Amazon Web Services
AWS News Blog Introducing CloudFront Functions – Run Your Code at the Edge with Low Latency at Any Scale With Amazon CloudFront, you can securely deliver data, videos, applications, and APIs to your customers globally with low latency and high transfer speeds. To offer a customized experience and the lowest possible latency, many modern applications execute some form of logic at the edge. The use
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
用 ts-migrate 仙女棒讓 JS 專案瞬間migrate 成 TypeScript
(PDF) COSMICDUKE Cosmu with a twist of MiniDuke - F-Secure
Benchmarking JavaScript memory usage
