はじめに あなたはブラウザからデータベース(DB)に情報が行き着くまでにどんな技術が使われているか説明できますでしょうか? どのようなプロトコルが用いられ、どの技術を駆使してサーバと通信しているのか、Webサーバでは何が行われ、どのようにして負荷が分散されているのか、トランザクションはどのように管理されているのか、そしてデータベースではシャーディングや負荷対策のためにどのような対策が取られているのか… なんとなくは理解しているものの、私は自信を持って「こうなっている!!」とは説明ができません。 そこで今回は「大規模サービス」を題材としてブラウザからデータベースに至るまでの、情報の流れとその背後にある技術について、明確かつ分かりやすく解説していきたいと思います。 対象としてはこれからエンジニアとして働き出す、WEB、バックエンド、サーバーサイド、インフラ、SREを対象としております。 1.
巨大掲示板サイト「5ちゃんねる」(旧2ちゃんねる)が、サードパーティー製専用ブラウザで軒並み閲覧不可能になる事態となっています。すでに、主要な専用ブラウザの1つだったJane Styleは5ちゃんねる(5ch.net)への対応を終了し、「Talk」(talk.jp)という新しい掲示板の専用ブラウザに姿を変えています。 5ちゃんねる https://5ch.net/ Jane Style公式サイトは以下のように、すでに「Talk専用ブラウザ」を名乗っています。 Talk専用ブラウザ 「Jane Style」 http://janesoft.net/janestyle/ 更新履歴を見ると2023年7月10日公開のVer5.00でTalkに対応、5ch.netのサポートを終了しています。 iOS向けの「Twinkle」も同様の対応で、起動するとアップデートを求められ、アップデート後、継続使用する
先日リリースされたChrome 114でPopover APIがサポートされ、HTMLのpopover属性が使用できるようになりました。 今まではポップオーバーを実装するのにはJavaScriptを使用し、ポップオーバーの開閉・フォーカス・アクセスフックなど面倒でしたが、popover属性で実装すると驚くほど簡単で、さまざまなUIコンポーネントに利用できます。 Introducing the popover API by Una Kravets 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに HTMLのpopover属性とは ポップオーバーのデフォルト、オーバーライド 自動ポップオーバーと手動ポップオーバー popover属性とdialog要素の違い 近日公開予定の便利な2つの機
はじめに 最近Denoをよく触っており、DenoのSSRフレームワークであるFreshのミドルウェア・キャッシュについて調べている際にブラウザキャッシュのEtagヘッダが使用されており、気になったのでブラウザキャッシュの仕組みについて調べてみました。 Etagの正体 Etagとは、ブラウザキャッシュの仕組みの中で使用されるHTTPレスポンスヘッダーでリソースの特定のバージョンに関する識別子のことです。 Etagがあることでウェブサーバーは、コンテンツが変更されていない場合はレスポンス全体を再送する必要がないので、キャッシュがより効率的になる。 ブラウザキャッシュの設定について ブラウザキャッシュを設定する際に必要なHTTPレスポンスヘッダーはEtagを含めて以下の通りです。 Expiresヘッダー Cache-Controlヘッダー Last-Modifiedヘッダー Etagヘッダー そ
2023年度が始まり、新卒社員が一気に社会人デビューした。4年制大学を卒業して新たに社会人になった人たちは2000年度生まれで、小学校低学年のころにはすでにiPhoneが日本に上陸していた世代でもある。 中にはスマートフォンの操作には慣れているが、PCの操作は授業で少し触った程度という人もいるかもしれない。今回はそんな新卒社員や、教育に当たる先輩社員が知っていると仕事が楽になる「Webブラウザの便利なショートカット」を紹介する。 なお、今回はWindows端末でWebブラウザ「Chrome」を想定して解説する。 タブを開く、閉じる タブを開く=「Ctrl+T」 タブを閉じる=「Ctrl+W」 タブを開く/閉じるという動作はWebブラウザを使って作業する上では幾度となく繰り返すもの。そのたびにいちいちマウスを動かしてクリックしていると案外時間を無駄にしてしまう。ショートカットが身につけば地味
Google Chrome、メモリの大食い、やめるってよ2023.02.20 19:00133,983 三浦一紀 これは期待大。 多機能で使いやすいWebブラウザ「Google Chrome」が、最新バージョン「Chrome 110」で、「メモリセーバー」と「省エネモード」を搭載。 順次アップデートが行なわれています。 メモリとバッテリーを節約「メモリセーバー」は、アクティブではないタブのメモリを解放して、アクティブなタブや他のアプリのために使用する機能。 「省エネモード」は、バックグラウンドアクティビティと視覚効果を制限して、バッテリーを節約する機能です。 僕のChromeにもやってきた!ということで、自分のGoogle Chromeを見てみたら、最新のChrome 110のアップデートが来ていたので、早速アップデートしました。 Image: 三浦一紀設定画面で「パフォーマンス」という項
先日リリースされたChrome 108で、CSSの新しいビューポート単位(svh, lvh, dvhなど)がサポートされました。SafariとFirefoxではすでにサポートされていましたが、Chromeでもサポートされたのは朗報です。 この新しいビューポート単位の基本的な使い方と注意事項を紹介します。 The large, small, and dynamic viewport units by Bramus 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。 はじめに おさらい: ビューポートとその単位 新しいビューポート単位の必要性 注意事項 リソース はじめに 先日リリースされたChrome 108で、動的なバーがあるスマホのビューポートを考慮したCSSの新しいビューポート単位がサポートされました。SafariとFirefoxではすでにサポート
大きめのテーマです。もしかしたら「うちでは書いた JS をそのまま配信してるぜ〜」って人もいるかもしれないでが。 最近の Web フロントエンド開発では、書いた JavaScript をそのまま動かさないことが多い 最近のフロントエンド開発ではエンジニアが書いた JavaScript をそのままブラウザで動かすことはほとんどないかもしれません。 例として最近流行のフレームワークを考えてみましょう。Next.js や Remix、Nuxt.js など、いずれも内部的にトランスパイラやモジュールバンドラを使い、エンジニアが書いた JavaScript を別の形へと変換してからユーザーのブラウザで動かすような仕組みになっています。 一昔前だと Next.js のようなフレームワークが今ほど発展していなかったこともあり、webpack や Babel を直接使っていたと思いますが、それも同じです。
Raycastとは Raycastとは、非常に高速で拡張可能なMacのランチャーアプリケーションです。Macの標準機能であるSpotlightの自由度を高めたようなアプリで、優れたUIUXによる利便性や拡張性も兼ね備えており(割と手軽に)作業の生産性を大いに高めることができます。 しかも、個人利用は実質無料(2022年10月現在)で、ユーザー登録をせずともすぐに生産性を向上させられる神アプリです🌟 以下公式サイトもしくは、Homebrew経由でインストールできます。 ■ 公式 ■ Homebrew Alfredからの卒業 Macの有名なランチャーアプリとしては、Alfredが非常に有名だと思います。今回紹介するRaycastと同様、様々な機能が用意されており、快適な作業と生産性の向上に大きく貢献する便利なアプリケーションです。 ただ、Alfredを本気で便利アプリとして使いこなすためには
どうも、まさとらん(@0310lan)です! 今回は、さまざまなチュートリアルガイドを簡単に自動生成してくれる無料のWebサービスをご紹介します。 例えば、Webサービスを初めて利用するユーザー向けのチュートリアルなどを、非常に簡単なステップでドキュメント化してくれます。 アイデア次第でさまざまな使い方ができるので、ご興味ある方はぜひ参考にしてください! 【 Scribe 】 ■「Scribe」の使い方 それでは、「Scribe」をどのように使えばいいのか詳しく見ていきましょう! まずはサイトの上部にあるボタンをクリックして、無料のユーザー登録を済ませておきます。 自分の好きなユーザー名を入力しましょう。 次に、メールアドレスを入力します。 続いてパスワードを設定したら、登録したメールアドレス宛に認証リンクが送付されるのでクリックしてログインしてください。 「Scribe」が提供するブラウ
Google、ChromeとAndroidのパスワード管理UIを統一 自動生成ではないパスワード設定が可能に 米Googleは6月30日(現地時間)、ChromeブラウザとAndroid端末で提供しているパスワード管理サービス(Androidでは「パスワード マネージャー」)の複数の改善を発表した。また、iOS版Chromeでもパスワードを自動生成できるようにする。 ChromeとAndroidでのUI統一 Chromeのパスワード管理機能は、[設定]→[自動入力]→[パスワード]に、Androidのパスワード マネージャーは、[設定]→[プライバシー]→[Googleの自動入力サービス]→[パスワード]という奥深いところにある。この2つは実質同じものだが、これまでユーザーインタフェース(UI)がかなり違った。まず、これを統一する。 また、同じサイトあるいはアプリで複数のパスワードを設定し
MicrosoftのEdge、世界で最も使用されているデスクトップブラウザ2位に2022.05.06 16:0032,959 Andrew Liszewski - Gizmodo US [原文] ( そうこ ) 「いんたーねっとえくすぷろーらー」という存在すら知らない人がいる一方で、MicrosoftのブラウザEdgeは、大先輩のかつての活躍に恥じないようがんばっています。ウェブ解析を行なうStatCounterによれば、最も使用されているデスクトップ版ブラウザの2位がAppleのSafariからEdgeに入れ替わりました。ちなみに、絶対的王者はGoogleのChrome、4位につけているのはFirefoxです。 Edgeがリリースされたのは2015年。なーんだかなぁという雰囲気のまま、成功とは言い難かったのですが、昨年、ガラリと生まれ変わりました。GoogleのChromeと同じくChr
画力・博士号・油田 @bd_gfngfn ユーザがタブを開きすぎる問題,端的な原因は「履歴とブックマークの利便性がタブを開き続ける場合のそれを超えることができていないから」に思える(少なくとも自分はそう) 2022-04-26 22:16:07
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く