It's time for modern CSS to kill the SPA
Native CSS transitions have quietly killed the strongest argument for client-side routing. Yet people keep building terrible apps instead of performant websites. The app-like fallacy “Make it feel like an app.” At some point during the scoping process, someone says the words. A CMO. A digital lead. A brand manager. And with that single phrase, the architecture is locked in: it’ll be an SPA. Probab
Why your website should be under 14kB in size | endtimes.dev
Having a smaller website makes it load faster — that's not surprising. What is surprising is that a 14kB page can load much faster than a 15kB page — maybe 612ms faster — while the difference between a 15kB and a 16kB page is trivial. This is because of the TCP slow start algorithm. This article will cover what that is, how it works, and why you should care. But first we'll quickly go over some of
Webサーバーがどのようにリクエストを並行に処理しているのか、説明できなかったのでRustでコードを書いてみる
はじめに Webサーバーがどのように大量のリクエストを並行に処理しているのか、説明できますか？ 私は今まで、実際のところどのようにこれらが実装されているのかをよくわかっておらず、ブロッキングなコードを書いてしまったりしていました🤫 結論から述べると、Webアプリケーションでは、リクエストが大量に来た場合にいかに効率よく処理するために「並行（Concurrency）」や「並列（Parallelism）」を利用しています。 今回の記事では、この並行処理が実際のところどのように動作するのか、Rustのサンプルコードを示しつつ、解説していきます。 単一スレッドによるシンプルなサーバー 最初に、単純な「1件ずつ順番にリクエストを処理するサーバー」を例に、その動作や問題点を確認します。 レストランに例えると、「店員が1人しかいないレストラン」を用いると、注文ごとに料理に取り掛かるため、待ち時間が長く
Interop 2025が始まりました！
2月14日（日本時間）、ブラウザ間でのWeb標準の相互運用性を向上するプロジェクト「Interop」の2025年プロジェクトが始まりました。 この記事では、Interop 2024の振り返りと、Interop 2025でどのAPIが重点対象として選出されたのかについて触れていきます。 前提知識として、Interopそのものの取り組みについての解説については、昨年書いたInterop 2025のプロポーザル投票が始まりました！をご覧ください。 Interop 2024の振り返り 2025年のInteropプロジェクトについて触れる前に、2024年のInteropプロジェクトについて振り返ってみましょう。 Stable Experimental 最新の安定版ブラウザでのリリースにおいては全体で95点まで網羅されており、プレリリース版においては97点まで網羅されていました。安定版でのテスト網羅率
DevTools の使い方を可能な限りスクショ付きで解説してみる
以下の公開計測会でやったものを個別に解説してみる。 細かいテクニックが多いのだが、それを可能な限りテキストとスクショで解説したい。使い方の解説が中心で、どういう意味があるかは解説しない。 Chrome131時点のスクリーンショットで、後で読む場合は頻繁にUIが変わっている点に注意。大事なのは意図。 宣伝: これを御社のサイトで解説する仕事をやっています。 デモのURL これに意味はなく、今日偶然見ていただけで意図はない。関係ないがエッジランナーズは最高のアニメ。 DevTools を開く F12 or 右クリックから「検証」 DevTools > Lighthouse この状態で計測 このとき、新しいプロファイルを作ったりして、可能な限り Chrome拡張が入ってない状態にすること。Chrome拡張による処理も計測に含まれてしまう。 Lighthouse レポートの読み方 点数部分にマウス
State of HTML 2024
Despite its name, this survey is about a lot more than just HTML. Don't get me wrong – HTML itself is more relevant than ever today, which is quite impressive for a 30-year old technology. Even so, we've tried to broaden the survey's scope even more to the web platform as a whole. From browser APIs, to web development pain points, to accessibility strategies, to analytics and performance tools, th
任天堂ゲームソフトの古い公式ウェブサイトの魅力を語る - 世界のねじを巻くブログ
ニンテンドーミュージアムもいいけれど 2024年にクラフトインターネットなど、 古き良きインターネットに注目が集まっていたけれど、 僕は昔から「もう使われなくなった"ウェブ廃墟"」を探すのを趣味にしてます。 www.nejimakiblog.com 今年の秋、京都にオープンするニンテンドーミュージアムが話題なので、 史料価値的という意味でも読まれるべきだと思う 任天堂の「ゲームソフト公式HP」をいくつか紹介しようかなと。 ニンテンドーミュージアムもいいけれど スーパーマリオサンシャイン ポケットモンスター ピカチュウ版 メトロイドプライムハンターズ スターフォックス６４ 星のカービィ２ ゼルダの伝説 風のタクト モンスタータクティクス公式ウェブサイト ニンテンドウオールスター! 大乱闘スマッシュブラザーズ マザー２ スーパーマリオランド ６つの金貨 他社事例 まずは夏ということでこのゲーム
徳丸さん、こんにちは。 読売のような大手メディアのサイトでもサポート詐欺の偽警告が表示されるようになってしまいましたし、今の時代は広告ブロッカーが必須と考えたほうが安全なのでしょうか？ | mond
徳丸さん、こんにちは。 読売のような大手メディアのサイトでもサポート詐欺の偽警告が表示されるようになってしまいましたし、今の時代は広告ブロッカーが必須と考えたほうが安全なのでしょうか？ 徳丸が書いていないことを質問いただくことが時々ありますが、私が書いてないのは書きたくない理由があるから（単にめんどうくさいも含む）です。ですが、せっかく質問いただいたので、思うところを書いてみようと思います。 まず、私自身は広告ブロッカーを使っていないです。その理由は、広告ブロッカーには危険なものがある（原理的にあり得るし、過去にあった）からです。過去には、広告ブロッカーが元の開発者から売却され、マルウェア化した例が複数あります。具体例は示しませんが、検索するとすぐに見つけられると思います。 広告ブロッカーがマルウェア化すると、これらはブラウザアドオンの形で動くため、非常に強い権限があり、すべてのサイトの情
Webサービス公開前のチェックリスト
個人的に「Webサービスの公開前チェックリスト」を作っていたのですが、けっこう育ってきたので公開します。このリストは、過去に自分がミスしたときや、情報収集する中で「明日は我が身…」と思ったときなどに個人的にメモしてきたものをまとめた内容になります。 セキュリティ 認証に関わるCookieの属性 HttpOnly属性が設定されていること XSSの緩和策（あくまでも緩和） SameSite属性がLaxもしくはStrictになっていること 主にCSRF対策のため。Laxの場合、GETリクエストで更新処理を行っているエンドポイントがないか合わせて確認 Secure属性が設定されていること HTTPS通信でのみCookieが送られるように Domain属性が適切に設定されていること サブドメインにもCookieが送られる設定の場合、他のサブドメインのサイトに脆弱性があるとそこからインシデントに繋がる
紙っぽいかわいいWebサイト作りたい - Qiita
かわいいWebサイトが作りたい Web上でグラフィックデザインっぽい表現をしてるサイト大好き！ 思いついたら追加する 「版ズレ」風 版ズレ ＝ 印刷の際に、色の版がズレて出力されてしまう現象。（アナログっぽい雰囲気を出すために、あえてズレているように見せるデザイン手法として使ってます） 一番上のレイヤーに紙っぽいテクスチャを乗せて乗算かける 後ろのテキストはaria-hidden="true"でスクリーンリーダーに読み上げられないようにする （疑似要素でやりたかったけど乗算上手くいかなかった・・） ▼ HTML <div class="hanzure"> <img src="紙っぽいテクスチャ" alt=""> <div class="hanzure01"> <p class="front">版ズレ風の表現</p> <p class="back" aria-hidden="true">版ズ
モバイルファーストのウェブデザインがデスクトップに及ぼす悪影響
モバイルファーストのウェブデザインは、デスクトップで閲覧する際に重大なユーザビリティ上の問題を引き起こす。長いスクロールページにコンテンツが過度に分散され、余白が広がり、画像やフォントが拡大されるため、ユーザーが情報を把握し、理解することが難しくなるのである。 The Negative Impact of Mobile-First Web Design on Desktop by Kim Salazar, Tim Neusesser and Nishi Chitale on October 13, 2023 日本語版2024年2月6日公開 最近のウェブサイトの多くは、モバイルファーストなアプローチでデザインされている。こうしたページをデスクトップデバイスで表示すると、コンテンツが過度に大きく引き伸ばされて見えることがある。画面を覆い尽くすような画像、肥大化したテキスト、過剰な余白のせいで、
RustでWebバックエンドを書き始めてから1年くらい経った
はじめに 僕はDeno Land Inc.でDenoを利用したサーバレスエッジホスティングサービスのDeno Deployを開発するチームに所属しています。OSSのほうのDenoのメイン言語はRustで、Deno Deployのバックエンドも同様にRustで書かれています。 今年のアドベントカレンダーで一休さんから以下の記事が公開されましたが、日本でもRustをWebバックエンドの言語として採用する企業がじわじわと増えてきている印象があります。 Deno DeployのバックエンドをRustで開発してきて、RustでWebバックエンドを書くことのメリットやデメリットをいくつか感じたので、この記事で紹介したいと思います。 Deno Deployの構成 まず、ざっくりとDeno Deployのバックエンドの構成を紹介します。 多くのコンポーネントがありますが、ここではどのようにRustを利用し
一休レストランのふつうのRustバックエンド開発 - 一休.com Developers Blog
この記事は一休.com Advent Calendar 2023 25日目の記事です。 一休レストランでは、よりスムーズな予約体験の提供を目的とするシステムのリニューアルを進めています。その一環として、2023年10月から、レストラン個別ページの表示から予約までのスマートフォンビューにおいて、バックエンドのサーバをRustで書かれたものに置き換えました。 一休レストランの Rust バックエンドが正式リリースされました。https://t.co/7N4VGv5ej9 このページのスマートフォンビューはバックエンドが Rust で書かれた GraphQL になってます— naoya (@naoya_ito) October 4, 2023 本番運用が始まって3か月近く経ちましたが、これまで安定して継続的な開発と運用ができています。これはRustだからと構えることなく、「ふつう」のバックエンド
Introducing "Lit" for Web Components
概要 2021/04/22に新しいWeb Componentsライブラリ、Lit(Lit 2.0)がリリースされ、同日ローンチイベントもYouTubeで生配信されました。 それに伴いPolymer ProjectがLitに改名されロゴが刷新されました。 ウェブサイトも新しく公開されました。チュートリアルとPlaygroundが刷新され、非常に便利になりました。 実装は https://github.com/lit/lit に公開されています。 LitElementとlit-htmlのおさらい 旧Polymer Project（Lit 1.0）では、lit-html(HTMLテンプレートライブラリ)とLitElement(Web Componentsを実装するためのライブラリ)の2つのライブラリが提供されていました。 LitElementにもテンプレート機能があったので、2つとも独立したライ
デジタル庁のサイトやばすぎるwww - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに みなさん、デジタル庁のサイトはご覧になったことはありますか？今話題のデジタル庁です。 こちらが2023年6月現在のデジタル庁のサイトです。やばくないですかこれ？最初見たときこれ「やっばw」と思いました。これからこのサイトのやばさを語っていきたいと思います。 洗練されたシンプルさ、そしてデザイン 僕は最初見たときびっくりしました。「なんてシンプルで見やすいんだ！」官公庁のサイトですよ？官公庁のサイトといえば、細かい字がずらっと並んで見づらいイメージでしたが、デジタル庁のサイトはとことんシンプルさを追求して見やすくしてます。フォン
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Migrating your React app from Webpack to Vite
Webアクセシビリティ入門_2024
GitHub - DhanushNehru/Ultimate-Web-Development-Resources: A collection of web development resources for most of your development needs
Rustで書き直す · Issue #11078 · misskey-dev/misskey
今日から始めるリアルタイム配信の裏側
