両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン |
web [2019/09/27 13:56] – [Web サイト リカバリー] ともやん | web [2023/10/06 09:40] (現在) – [Web アプリ] ともやん |
---|
====== Web 関連 ====== | ====== Web 関連 ====== |
| |
===== 世界の爆速 Web サイト ===== | ===== プログラミング / サイト構築 / 開発 ===== |
[[https://tools.pingdom.com/|Pingdom Tools]]\\ | [[html_css|HTML + CSS 関連]]\\ |
Web Server: [[https://www.cloudflare.com/|cloudflare]]\\ | [[:web:lesscss|lesscss - Less (which stands for Leaner Style Sheets)]]\\ |
* Pingdom Website Speed Test | [[so>questions/56393880/how-do-i-detect-dark-mode-using-javascript|How do I detect dark mode using JavaScript?]]\\ |
| |
[[https://www.netlify.com/|Netlify: All-in-one platform for automating modern web projects.]]\\ | ===== Web アプリ ===== |
Web Server: [[https://www.netlify.com/|Netlify]]\\ | [[web:drawio|draw.io - クロスプラットフォームのグラフ描画アプリ]]\\ |
| [[https://www.drawio.com/|]]\\ |
| [[https://www.drawio.com/blog/embedding-walkthrough|]]\\ |
| |
[[https://nuxtjs.org/|Nuxt.js - The Vue.js Framework]]\\ | ===== コンテンツ最適化 ===== |
Web Server: [[https://www.netlify.com/|Netlify]]\\ | **PageSpeed Insights**\\ |
Web App Framework: Nuxt.js\\ | [[https://developers.google.com/speed/pagespeed/insights/|]]\\ |
| |
[[https://dev.to/|https://dev.to/ - DEV Community 👩💻👨💻]]\\ | [[https://www.thinkwithgoogle.com/intl/ja-jp/feature/testmysite/|モバイルサイトの速度を比較しましょう]]\\ |
Web Server: [[https://ninenines.eu/|Cowboy - 小さくて高速な最新のHTTPサーバー]]\\ | |
Web App Framework: Ruby on Rails\\ | |
Chrome DevTools の計測結果(*1):\\ | |
{{:web:devtools_dev_to.png?640|Chrome DevTools - dev.to}}\\ | |
cache off 時:\\ | |
{{:web:devtools_dev_to_cache_off.png?640|Chrome DevTools - dev.to (cache off)}}\\ | |
| |
[[javascript:ide|IDE Labo - 総合開発環境の実験的実装]] - tomoyan.net で一番重いコンテンツ\\ | ===== 世界の爆速 Web サイト ===== |
Web Server: [[https://httpd.apache.org/|Apache]] + 独自チューニングした DokuWiki\\ | [[web:world_explosion_speed_website|世界の爆速 Web サイト]]\\ |
Chrome DevTools の計測結果(*1):\\ | |
{{:web:devtools_ide_labo.png?640|Chrome DevTools - tomoyan.net IDE Labo}}\\ | |
cache off 時 (IDE 重すぎ ^^;;):\\ | |
{{:web:devtools_ide_labo_cache_off.png?640|Chrome DevTools - tomoyan.net IDE Labo (cache off)}}\\ | |
[[start|Top page]] cache off 時:\\ | |
{{:web:devtools_tomoyan_net_top_cache_off.png?640|Chrome DevTools - tomoyan.net Top page (cache off)}}\\ | |
| |
*1 計測結果はキャッシュ済時の速度である。(何れも 2回目以降の表示速度)\\ | ===== ツール ===== |
当サイトも意外に爆速なようである (^^;;)\\ | [[git>SVG-Edit/svgedit|SVG-Edit/svgedit: Powerful SVG-Editor for your browser]]\\ |
しかし、dev.to は ページ遷移が異常に速い!! (ajax で先読みなど高度な高速化を行っている)\\ | [[https://developers.facebook.com/tools/explorer/|グラフ API エクスプローラ - Facebook for Developers]]\\ |
詳しくは [[https://qiita.com/saboyutaka/items/1f528ec3ce85476d7561|dev.toがなぜinsanely fastを実現出来ているか - Qiita]]\\ | [[https://developers.facebook.com/docs/graph-api|グラフ API ドキュメント]]\\ |
| |
===== Web フォント ===== | ===== フォント ===== |
| [[web:web_font|Web フォント]]\\ |
[[https://fonts.google.com/|Google Fonts]]\\ | [[https://fonts.google.com/|Google Fonts]]\\ |
[[https://www.cdnplanet.com/blog/faster-google-webfonts-preconnect/|Faster Google Fonts with Preconnect - CDN Planet]]\\ | [[https://www.cdnplanet.com/blog/faster-google-webfonts-preconnect/|Faster Google Fonts with Preconnect - CDN Planet]]\\ |
===== Web サイト リカバリー ===== | |
| ===== デザイン ===== |
| [[https://www.cssdesignawards.com/|CSS Design Awards - Website Awards - Best Web Design Inspiration - CSS Awards]]\\ |
| |
| ===== 素材 ===== |
| **アンスプラッシュ - ハイクオリティな無料写真**\\ |
| [[https://unsplash.com/|Beautiful Free Images & Pictures | Unsplash]]\\ |
| |
| **クリエイティブ・コモンズ - 著作物の再利用を許可している素材を検索**\\ |
| [[https://creativecommons.org/|When we share, everyone wins - Creative Commons]]\\ |
| [[https://search.creativecommons.org/|CC Search]]\\ |
| |
| **ウィキメディア・コモンズ - WikiPedia などに利用されている無料素材**\\ |
| [[https://commons.wikimedia.org/|Wikimedia Commons]]\\ |
| 誰でも投稿できる自由に使用できるメディアファイルのコレクション\\ |
| [[https://commons.wikimedia.org/wiki/User:Paintpot|Linux Icon]]\\ |
| [[https://commons.wikimedia.org/wiki/User:Paintpot/Tango|User:Paintpot/Tango - Wikimedia Commons]]\\ |
| |
| **ワールドベクターロゴ - すべてのブランドのベクトルのロゴ**\\ |
| [[https://worldvectorlogo.com/ja|Worldvectorlogo: ブランドのロゴをダウンロードして無料]]\\ |
| |
| ===== Web サイト リカバリー / ウェブ魚拓 ===== |
Web サイトのソースが無い場合にリカバリーに利用できるかもしれないサービス\\ | Web サイトのソースが無い場合にリカバリーに利用できるかもしれないサービス\\ |
| 使い方によっては防弾ホスティングより強力な Web サイトの保管場所で、日本ではウェブ魚拓などが有名である。\\ |
| |
| Wayback Machine\\ |
[[https://web.archive.org/|Wayback Machine]]\\ | [[https://web.archive.org/|Wayback Machine]]\\ |
[[http://webcache.googleusercontent.com/search?q=cache:https://tomoyan.net/|]]\\ | [[https://chrome.google.com/webstore/detail/wayback-machine/fpnmgdkabkmnadcjpehmlllkndpkmiak|Wayback Machine - Chrome ウェブストア]]\\ |
| <html><span class="wrap_em">Save Page Now: <code>https://web.archive.org/save/<url></code></span></html>\\ |
| |
| Archive-It\\ |
| [[https://archive-it.org/|Archive-It - Web Archiving Services for Libraries and Archives]]\\ |
| |
| Webpage archive\\ |
| [[http://archive.is/|Webpage archive]]\\ |
| |
| Google Web Cache\\ |
| [[https://webcache.googleusercontent.com/search?q=cache:https://www.tomoyan.net/|]]\\ |
| |
| ウェブ魚拓\\ |
| [[https://megalodon.jp/|ウェブ魚拓]]\\ |
| |
| ==== 参考 ==== |
| [[https://gigazine.net/news/20180201-archive-it/|億万長者からの圧力でニュース記事や文書を葬られないよう保存する「Archive-It」とは? - GIGAZINE]]\\ |
| |
===== サーバー ===== | ===== サーバー ===== |
| [[https://geekflare.com/open-source-web-servers/|7 Open Source Web Servers for Small to Large Sites]]\\ |
| |
**Google Accelerated Mobile Pages (AMP)**\\ | **Google Accelerated Mobile Pages (AMP)**\\ |
[[https://amp.dev/|AMP - a web component framework to easily create user-first web experiences - amp.dev]]\\ | [[https://amp.dev/|AMP - a web component framework to easily create user-first web experiences - amp.dev]]\\ |
[[https://wordpress.org/plugins/amp/|AMP – WordPress plugin | WordPress.org]]\\ | [[https://wordpress.org/plugins/amp/|AMP – WordPress plugin | WordPress.org]]\\ |
| [[https://www.sitespeed.io/|Welcome to the wonderful world of Web Performance]]\\ |
| |
| ==== Web サーバー ==== |
| [[http://monkey-project.com/|Monkey Server]]\\ |
| |
| ==== Google technology ==== |
| [[https://www.publickey1.jp/blog/21/http3quicietfrfc_9000.html|HTTP/3の基盤となる「QUICプロトコル」の標準化プロセスが完了、IETFの「RFC 9000」として - Publickey]]\\ |
| [[https://developers-jp.googleblog.com/2020/10/chrome-http3-ietf-quic.html|Google Developers Japan: Chrome への HTTP/3 と IETF QUIC の導入について]]\\ |
| [[https://developers-jp.googleblog.com/2015/11/brotli.html|Google Developers Japan: インターネット用の新しい圧縮アルゴリズム、Brotli のご紹介]]\\ |
| |
| [[tw>tomoyan596/status/1401642832511717376|protocol h3になる日も近いのかなぁ🤔 / Twitter]]\\ |
| |
| ===== サービス ===== |
| [[web:freedb|freedb]]\\ |
| [[web:google|Google]]\\ |
| |
| ===== フレームワーク ベンチマーク ===== |
| js-framework-benchmark\\ |
| [[https://github.com/Freak613/js-framework-benchmark|GitHub - Freak613/js-framework-benchmark: A comparison of the perfomance of a few popular javascript frameworks]]\\ |
| |
| |
| ===== Web API ===== |
| [[wp>Web_API|Web API]]\\ |
| |
| [[web:amazon_pa-api|Amazon Product Advertising API v5]]\\ |
===== ブラウザ ===== | ===== ブラウザ ===== |
[[web:chrome|Chrome]]\\ | [[web:chrome|Chrome]]\\ |
| [[web:vivaldi|Vivaldi - 超絶便利。タブ管理や広告で悩まないブラウザ]]\\ |
| [[web:brave|Brave - プライバシーを重視した高速かつ安全な次世代ブラウザ]]\\ |
[[web:firefox|Firefox]]\\ | [[web:firefox|Firefox]]\\ |
[[web:ie8|Windows Internet Explorer 8]]\\ | [[web:ie8|Windows Internet Explorer 8]]\\ |
| [[web:html5test|HTML5test]]\\ |
| [[wwjp>ウェブブラウザの利用シェア|ウェブブラウザの利用シェア | Wikiwand]]\\ |
| |
===== レンタルサーバ ===== | ===== レンタルサーバ/VPS/ホスティング ===== |
| [[web:sakura_vps|さくらのVPS]]\\ |
| [[web:netlify|Netlify - 高機能ホスティングサービス]]\\ |
[[web:value_domain|VALUE DOMAIN(バリュー ドメイン)]]\\ | [[web:value_domain|VALUE DOMAIN(バリュー ドメイン)]]\\ |
[[web:rental_server|レンタルサーバ]]\\ | [[web:rental_server|レンタルサーバ]]\\ |
| |
| ===== CDN (Content Delivery Network) ===== |
| [[web:cloudflare|Cloudflare - Web パフォーマンス & セキュリティ カンパニー]]\\ |
| [[web:jsdelivr|jsDelivr - オープンソース CDN 無料、高速、信頼性の高い]]\\ |
| [[https://videocdn.tv/|VideoCDN]] - すべてのファイルが CDN にあるビデオバランサ\\ |
| |
| ===== IRC (Internet Relay Chat) ===== |
| [[http://freenode.net/|freenode]]\\ |
| [[wpjp>Freenode]]\\ |
| |
| ===== 参考文献 ===== |
| [[https://webrtcforthecurious.com/|WebRTC For The Curious]]\\ |
| [[https://webrtcforthecurious.com/ja/|好奇心旺盛な人のためのWebRTC]]\\ |
| |
| ==== 付録 ==== |
| [[tw>tomoyan596sp/status/1639012908293328897|2時間くらいで爆速全内容把握の旅😅Web標準テクノロジー人巡り、HTMLとCSSの仕様は読み切るのは無理だ‼️🤣HTTP/3の最新動向に偏ったかも🤔]]\\ |
| |