コンテンツ・デリバリ・ネットワークの略で、ウェブコンテンツの配信を最適化するネットワークの仕組み。複数のウェブサーバーを分散配置し、目的のウェブサイトを場合により一時保存、利用する各ユーザーを適切に振り分けることで、利用者にとってはコンテンツの高速化および安定化、運営者にとってはサーバーの負荷の分散をもたらす。
動画などのメディア配信、また非常に多数の訪問者を抱えているなど、大規模、大容量のアクセスがあるサイトで採用される。
JavaScript でプログラムを開発して意気揚々とGitHubで公開し、せっかくだから はてなブログの記事に実装してしまおう! となったところで、さて、記事にコードを埋め込むのはメンテナンス性を損なってしまいます。 GitHub は Raw コードを参照できるページを提供していますが、 CORS の問題があって他サイトでは利用できません。何かいい方法はないでしょうか。 そこで jsDeliver です。 GitHub のページの URL をペーストしたら CDN の URL にして返してくれるツールがあります。このブログの中で動作を確認しています。 はてなブログなら記事に埋め込むこともでき…
経緯 CDNとは 自分が見ている映像はどこからきているのか?verAkamai 自分が見ている映像はどこからきているのか?verCloud Front 合わせ技 トラフィックがいかに異常だったか おまけ:H.264コーデック 参考ツイート 経緯 2022年Wカップは日本がジャイアントキリングを達成して決勝トーナメントに進出。その1回戦は非常に注目されていたが、その中でも特に「本田の解説がおもしろい!」とAbemaTVでのインターネット中継放送が人気であった。 当日は約2000万人(延べ)がAbemaTVの放送を視聴していたようだ。 同時にこれだけの人数に映像を配信する仕組み(バックエンドとフロ…
こんにちは LOVOT の OS を作っているチームのひとり id:atotto です。 LOVOT の OS について、簡単ですがお話させていただきます。 LOVOTとNest(LOVOT ANATOMY より一部抜粋) 早速ですが、かわいらしい LOVOT には、x86系のCPU(メインコンピュータ)、そして、ARM系のCPU(サブコンピュータ)の2つが搭載されています。これだけでも OS の管理が難しいのですが、LOVOT の製品には Nest (巣: 充電ステーション)の x86系のCPU(エッジコンピュータ)もあり、合計 3つの独立した OS が存在しています。(詳しいspecはこち…
少しハマったので、忘れないように解決策を書いておく。 結論から言うと、cdnに使用しているリンクの中に、createApp関数が入っていないため、定義されていないというエラーが生じてしまっている。 そのため、 stackoverflow.com こちらに示してあるように、以下のリンクを読み込む必要がある。 要らないものまで読み込んでしまうので、全て読み込む必要はないが、 をvueのcdnの下に書き加えるとエラーが解消された。
React.jsプロジェクトのセットアップは初心者にとって非常に時間がかかる手順であり、特にReactエコシステムの初心者の場合はより困難となります。 しかし、一般的にはcreate-react-app(CRA)を使用してReact.jsアプリケーションを作成することが推奨されています。 CRAは、正確なnpmバージョンやReact関連ライブラリなどの心配をする必要がなく、npx create-react-appのようなコマンドを使用するだけでReactプロジェクトを構築することができます。 CRAはReactプロジェクトの構築に非常に便利なツールであり、事前に学習しなくても簡単に始めることが…
こんにちは! アソビュー開発チームの山内です! 先日、自転車でしまなみ海道を渡ってきました。 途中、ゲリラ豪雨に遭いながらもなんとか75km完走しました。ゴール後の温泉は最高ですね。 次は、晴れた日に渡って温泉に入ろうと思います。 はじめに アソビュー!では、2022年のゴールデンウィークの4/29 ~ 5/8の間に約2,300万のPVがありましたが、システムダウンすることなく、多くのゲストにワクワクを届けることができました。 今回は、私達がゴールデンウィークに向けて準備した背景と、アプリケーションでの負荷対策を紹介します。 背景 アソビュー!は、全国の遊びやレジャーチケットを予約・購入して体…
はじめに パフォーマンスや負荷対策としてキャッシュを用いるという手法はよくあり、AWS CloudFrontもそれを提供するサービスの一つです。 しかしながら利用する上でいくつか注意点があるため、今回は3点ほど書いていこうと思います。 1-1. 静的コンテンツ用のエイリアスをCloudFrontで発行する 動的コンテンツをキャッシュしてしまうとマズイために動的コンテンツはCloudFrontを通さないようにする場合は静的コンテンツのみそれ用のエイリアスをCloudFrontで発行します。 サイトのFQDNはexample.co.jpだけど、画像などの静的コンテンツについてはsubexample…
LaTexで数式を表示させるのに30分くらい引っかかってしまったが、 デザイン設定でMathJaxのCDNのリンクURLを読み込む 編集をMarkdownモードに切り替える 数式を書く の順番でやっていけば良いことがわかった。 デザイン設定でMathJaxのCDNのリンクURLを読み込む方法 MathJaxのCDNリンクは <script> MathJax = { tex: {inlineMath: [['$', '$'], ['\\(', '\\)']]} }; </script> <script id="MathJax-script" async src="https://cdn.jsde…
CDNって何ですか? CDN とは 有名なCDN CDNを使うとどんな良いことがある? CDNの仕組み 1.クライアント 2.エッジサーバ 3.オリジンサーバ 通常のウェブアクセスの場合 CDNを利用したアクセスの場合、 CDNを利用するときのDNSの話 CDNの料金 CDNのメリットを活かすために 1. キャッシュヒット率を上げる 2. キャッシュクリアは少なめに 3. コンテンツの容量は控えめに CDNのデメリット まとめ CDNって何ですか? こんにちは、ラクスのインフラを担当している akiponx です。 今回はCDNについて書いてみようと思います。 みなさん、CDNって知ってますか…
こんにちは! 最近、釣りにハマりだした虎の穴ラボのS.Sです。 この前は、サビキ釣りで、たくさんのイワシと小サバを釣ってきました。 昨今、スマホの普及や回線速度の高速化で、高解像度の画像や動画などを数多くのコンテンツをサイトに掲載する機会が増えてきました。 その中で、安定かつ高速にコンテンツを配信するためにキャッシュやCDN(Content Delivery Network)などコンテンツ配信に関する技術が解説された本を購読しましたので、今回はこちらをご紹介します。
OBS Studioに関するメモをたくさん書いてる記事。 ※「OBS Studioに関する個人的メモ」を移転しました。(現在は閲覧不可) 記事投稿日 2021年10月6日、最終投稿更新日 2023年05月29日 07時20分頃 かなり文字数が多いのでブラウザの検索機能をお使いください。 将来的に記事を分けて投稿したいと思ってます。(現在作業中) 記事が見にくくてすみません… ★何かあった際の連絡先 Twitter のDM Discord → _c#0007 ※無料でOBSに関して自分が分かる範囲でサポートします。 ★OBSで困った際に連絡する際に書いてほしいこと ・発生している状況 ・試したこ…
1章:ユーザー数0から数百万人へのスケールアップ 2章:おおまかな見積もり 3章:システム設計の面接時のフレームワーク 4章:レートリミッターの設計 5章:コンシステントハッシュの設計 感想 先日購入した以下の書籍の読書メモです。アフィリンクとかじゃあないです。 amzn.asia 1章:ユーザー数0から数百万人へのスケールアップ 以下のような基本的な内容を扱っています。 単一サーバーをホストした際のリクエストの流れ データベース 垂直スケール / 水平スケール ロードバランサ データベースのレプリケーション キャッシュ CDN ステートレスとステートフル データセンター メッセージキュー ロ…
いまruby.wasmでブラウザ向けプログラミングするために <script src="https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@2.0.0/dist/browser.script.iife.js"></script> を使うとプロパティを参照しようとすると次のように書きます。 require 'js' documetnt = JS.global[:document] これを次のように書きたいです。 require 'js' documetnt = JS.global.document 次のモンキーパッチを書きました。 require '…
=============== ★【 お 詫 び 】★ …まったく気づいていなかったんですが… 昨年? 3月11日? 旧DNから、移行の以降? 【 画像を コピー 】していた はずの ものが、 (たとえば、こうなる、はず。だった…) https://cdn-ak.f.st-hatena.com/images/fotolife/R/Risu_KIRIGI/20230528/20230528095450.png ↑↓ すべて、【 画像 アドレス を コピー 】に、自動で! https://earthquake.tenki.jp/static-images/earthquake-map/recent…
・人の記事読んで知った え〜 りえさん 動物園辞めたの初めて知った 今更やけど おつかれさまでした! グリーンスター付けようとしたけど 持ってなかった…… ★★★★★★★★★★ ★★★★★★★★★★ ★★★★★★★★★★ (追記 グリーンスター持ってた!から付けてきた) ・元気 なんか早起きしてしまった(6:40くらい) 土曜にしちゃ 早いです 今日は通院なので ちょうどいい U-CAN(医療事務)の試験 5/28(日)に在宅受験で 問題一式が昨日(5/26)届いた もう昨日のうちに解いちゃったぞ(小声) 朝からやる気があっていいぞ 今日はPC久し振りに開いてDominoいじってみようかな と…
個人ブログのタグで絞り込みの書き方がイケてないのを思い出した APIによるタグの絞り込みが方法がわからなかったので下記のように全記事を取得してきてjsでフィルタをしていた。記事が少ない&ページングもしてない今は良いが、記事が増えたら破綻するので解消する。 結論 結論が出るまで 気づくまで 今のコードを理解しなおす おわり export const getArticleByTag = async (slug: string) => { const { items } = await client.getContents<Article>({ appUid: 'manas-diary', mode…
こんにちは。エンジニアの渡邉です。普段はLIFULL HOME'Sの売買領域のエンジニアチームにて開発を担当しています。好きなGCPのサービスはCloudRunです。 今回は、LIFULL HOME'Sの物件画像を次世代画像フォーマット「WebP」形式に動的変換して配信できるようにした取り組みについて紹介します。
こんにちは。今回は、WordPress初心者に向けて、検索エンジンで上位表示するためのSEO対策についてお伝えします。 WordPressは多くの人に利用されているCMS(コンテンツ管理システム)であり、ウェブサイト作成において非常に便利なツールです。しかし、作成したウェブサイトが検索エンジンの上位に表示されなければ、意味がありません。そこで、本記事では、WordPress初心者の方でも実践できるSEO対策方法を紹介します。 1. キーワードの選定と配置 まず、SEO対策において重要なのは、キーワードの選定と配置です。キーワードとは、検索エンジンで検索される単語やフレーズのことを指します。本記…
この記事はOSSプロジェクトの一環で、コピペでDockerアプリを立ち上げるシェルスクリプトを集めてます。 まだまだ途中のコードなのでご協力いただける方は本Qiitaに編集リクエストを提出するか、以下のリポジトリにプルリクエストの提出をお願いします。 https://github.com/new-awesomedocker/awesomedocker/blob/main/Readme.jp.md CDN nginx git clone https://github.com/new-awesomedocker/awesomedocker.git cd awesomedocker/nginx do…
こんにちは。今回は、WordPress初心者に向けて、AWSを活用したWordPressの構築方法や最適化方法について解説します。 はじめに WordPressは、初心者でも簡単にウェブサイトを作成できるCMS(コンテンツ管理システム)です。しかし、アクセス数が増えるとサイトの速度が遅くなるなどの問題が発生することがあります。そこで、AWSを使ってサイトを最適化することで、サイトの高速化や安定性の向上が期待できます。 AWSとは AWSとは、Amazon Web Servicesの略称で、Amazonが提供するクラウドコンピューティングサービスです。AWSを利用することで、ウェブサイトの運用に…
Marilyn Marathon ✙ 6/19 Wild Side Tokyoさん「✨👻次回来日出走情報👻✨ 2023/6/19(月) AVENTURE at Wild Side Tokyo OPEN 18:30 CHARGE ¥3600(D代込み) ✙✙✙✙✙ THE LEX B.B Marilyn Marathon ✙✙✙✙✙ チケット絶賛発売中!!! https://t.co/Z5KgxF024p https://t.co/xlnVqPVK0Y」https://twitter.com/M_Marathon_JP/status/1660488477589504001 CRAZY DANGE…
NOKTON Vintage Line 50mm F1.5 Aspherical MC を試す 写真のキャプションの下にあるURLをクリックすると、オリジナルサイズが開きます。 このレンズを付けて、まず石清水八幡宮に行ってみました。 石清水八幡宮参道ケーブル f=1.5https://cdn-ak.f.st-hatena.com/images/fotolife/b/bombo99/20230524/20230524000754_original.jpg 参道 f=11https://cdn-ak.f.st-hatena.com/images/fotolife/b/bombo99/2023052…
当記事は みずほリサーチ&テクノロジーズ × G-gen エンジニアコラボレーション企画 で執筆されたものです。 Cloud Armor は Google Cloud でセキュアな Web アプリケーションを構築するために欠かせないプロダクトです。 代表的なアプリケーションへの攻撃である SQL インジェクションを題材に、CloudArmor の機能を体験できるハンズオンを整備しました。 G-gen の片岩です。 当記事ではサーバレスな Web アプリケーションを構築し、SQL インジェクション攻撃から保護するまでの手順をご紹介します。 Cloud Armor はじめに Cloud Armor…
www.cdata.com 上記サイトにサンプルコードがあった。 <arc:set attr="xmlItem.uri" value="[FilePath]" /> <arc:set attr="xmlItem.xpath" value="/Items/To_Do" /> <arc:call op="xmlDOMSearch" in="xmlItem"> <arc:set attr="_message.header:todo_owner_email" value="[xpath('担当者メールアドレス')]"/> <arc:set attr="_message.header:todo_titl…