ウェブページの表示速度を改善するために気をつけなくてはいけないこと
ウェブページの表示が遅くなってしまう原因の一つに「JavaScriptの読み込み」があります。ブラウザはダウンロードしたhtmlドキュメントを上から順番に解釈して描画していくのですが、途中で「script」タグに出会うとJavaScriptの読み込み・実行が終わるまでその場所で解釈を一旦ストップしてしまいます。ページの表示速度に影響を与えずにJavaScriptを読み込むにはどうすれば良いのかについてfly.ioがまとめています。 Lighthouse: how to reduce render-blocking scripts https://fly.io/articles/lighthouse-how-to-reduce-render-blocking-scripts/ scriptタグが外部のJavaScriptを読み込むのかインラインで記述されているJavaScriptを実行するの
Awesome-crawler - Webクローラー使いたい放題の厳選リンク集 | ソフトアンテナ
Web上のリンクを辿りドキュメントや画像、PDFなどさまざまな情報を収集するプログラム「クローラー」。Googleのような巨大な検索エンジンもクローラー(ボット)が地道に収集した情報によって構築されています。 今回紹介する「Awesome-crawler」は、このWebクローラーに関する情報を集めたawesomeリンク集です。さまざまなプログラム言語で作られたクローラーフレームワークに関する情報が1カ所にまとめられています。 サイトには現在Python、Java、C#、JavaScript、PHP、C++、C、Ruby、R、Erlang、Perl、Go、Scalaで作られたクローラーフレームワークが含まれています。 やはり人気の高いプログラミング言語ほどクローラーの数も多く、世界トップクラスの人気を誇るスクリプト言語Pythonでは、多機能で有名なScrapyを初めとして以下のような多くの
JavaScript入門
JavaScript は Web サイトに動的な機能を追加するためのプログラミング言語です。 1995 年に米国の Netscape 社によって開発され、現在では Web 開発に欠かせない技術の一つとなっています。 JavaScript は Web ブラウザ上で直接動作するスクリプト言語であり、ボタンのクリックイベントやアニメーション、フォームの入力チェックなど、インタラクティブな機能を実装するのに利用できます。 JavaScript はブラウザさえあればすぐにプログラムを書いて実行できます。 Web ページの作成において、 HTML や CSS と組み合わせて利用されることも多いです。また、Node.js などを利用することでサーバーサイドの開発も可能となり、 JavaScript はフロントエンドからバックエンドまで幅広い用途で活用されています。 JavaScript は、オブジェクト
JavaScript初級者から中級者になろう — uhyohyo.net
このページの最終更新日：2019年7月4日 JavaScript。主にWebページを作るのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。 このページはJavaScriptの中級講座です。最新鋭ではないかもしれませんが、読み進めれば大抵のものを自分で作れるようになることでしょう。 言い訳とJavaScriptの歴史 / 問い合わせ 最近の更新2017/10/05 全ページを手直ししました。十六章第六回を追加。2017/11/9 十六章第二十一回・十六章第二十二回を追加。2017/12/2 十七章第三回・十七章第四回を追加。2017/12/3 十七章第五回・十七章第六回・十七章第七回を追加。概要コンテンツは第一篇と第二篇に分かれています。 JavaScriptは昔からWebページに動きを与えるものとして用いられてきましたが、第一篇ではそのような、昔からあるJav
70を越えるOAuthプロバイダに対応した認証デーモン·OAuth daemon MOONGIFT
OAuth daemonはnode/JavaScript製のオープンソース・ソフトウェア（GNU Affero General Public License）です。 OAuth.ioはフロントエンドエンジニアにとっては便利なサービスと言えますが、セキュリティ的にはOAuthの概念を覆してしまう問題があります。そこでOAuth.ioのコア部分を取り出してオープンソース化したOAuth daemonを使ってみましょう。 管理画面です。まず最初に管理者アカウントを設定します。 次にアプリケーションを作成します。複数作成が可能です。 ドメインも複数指定できます。 そしてプロバイダごとにキーの設定を行います。 例えばこんな感じです。 Tumblrなどになるとどこに設定を行うべきかのヘルプもあります。分かりやすいです。 クライアントID、シークレットを設定します。 その場で試すことができます。認証ダイ
初心者のためのホームページ作り/Web for beginner ホームページ作成支援
Play with ConfidenceLearn About Scollabo.com and our Commitment to Players If you’re searching for trusted gaming experiences tailored to Canadian players, we’ve highlighted platforms that consistently set industry benchmarks. Safety is paramount—every site featured here is fully licensed, secure, and transparent about their operations. Players can expect prompt payout speeds, top-rated customer s
HTMLクイックリファレンス
{"is_any_tile":false,"sources":[{"source":"bmc_bonus_type","table_games":false,"bonus_types":false,"game_providers":false,"slots":false,"live_games":false,"is_live_dealer":false,"payment_methods":false,"sport_types":false,"live_streaming":false,"cash_out":false}]} ウェルカムボーナス {"is_any_tile":false,"sources":[{"source":"bmc_bonus_type","table_games":false,"bonus_types":false,"game_providers":false,"sl
Re:初心者のコーダーでも簡単に実装出来るJavaScript/jQuery Tips
Re:初心者のコーダーでも簡単に実装出来るJavaScript/jQuery Tips ネタ元:初心者のコーダーでも簡単に実装出来るJavaScript/jQuery Tips : アシアルブログ ちょっと気になるコードがあるのでツッコミを。 １．現在見ているページのナビゲーションをアクティブにする if (document.URL.indexOf("001.html") != -1) { $("nav a.top").toggleClass("on"); } else if (document.URL.indexOf("002.html") != -1){ $("nav a.list").toggleClass("on"); } class属性の付加にtoggleClass()を利用しているけどaddClass()のほうがシンプルでよいです。 if (document.URL.index
いい加減、<script src="http://.. と書くのはやめましょう - DQNEO起業日記
外部サイトのJSファイルを読み込むときに、こういう書き方するのはやめましょう。 <script src="http://example.com/js/jquery.js"></script> 理由 あなたのサイトが、いつの日かSSLに対応することになったとき、そのscriptタグがバグの原因になります。 ご覧のとおり、HTTPSページの中でHTTP要素を読み込もうとすると、ブラウザによっては安全装置が働いて読み込んでくれないのです。 上の例ではjQueryの読み込みに失敗していますが、エラーメッセージ「Uncaught ReferenceError: jQuery is not defined 」を見てもHTTPS/HTTPのプロトコルが原因だとはすぐ気づかないので、わかりにくいバグになってしまいます。 結論 JSファイル(とかCSSとか画像とか)を読み込むときは、"http:"の部分を省
Mozilla Developer Center
このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。 �T ��View in English p� ��Always switch to English ウェブ開発者のためのドキュメント ウェブ開発者ガイド ウェブ開発者ガイドでは、目標やニーズに合ったウェブ技術を使用するのに役立つ、実践的な手引きのコンテンツを提供しています。 ウェブ開発者向けチュートリアル HTML、CSS、JavaScript、Web API の学習を段階的に進めるためのチュートリアルです。 アクセシビリティ ウェブサイトを使用する人に何らかの制約があっても、できるだけ多くの人が使用できるようにすることです。 パフォーマンス コンテンツをできるだけ早く利用できるように、操作できるようにすることです。 プライバシー ユーザーの個
Learn to Code - for Free | Codecademy
Grow in your career and unlock new opportunities by learning in-demand skills in AI, data, coding, cybersecurity, and more. Transform your team with Codecademy Teams trainingHelp everyone on your team build job-ready skills with a plan that offers flexible content assignment, progress tracking, and more.
「jQuery Mobile」の登場で、モバイルアプリケーション開発は大きく変わる － Publickey
このところHTML5関連のモバイルアプリケーション開発について調べていて、先週の水曜日にはSwapSkills主催のイベント「jQueryモバイルで簡単！ スマートフォンサイト作成」に参加してjQuery Mobileについて勉強してきました。 jQuery Mobileとは、jQueryのプラグインとして利用するモバイルアプリケーション用のライブラリです。そしてその驚異的なまでの簡単さは、これから業務用のモバイルアプリケーションの作り方を一変させてしまう可能性を感じさせます。 jQuery Mobileの大きな特徴は次の3つです。 1）HTMLを書くだけでモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Moblie、Symbianなどクロスプラットフォーム対応である 具体的な
簡単なゲーム作りを通してJavaScriptを学べる『JS Dares』 | 100SHIKI
学習サイトとして良さそうだったのでご紹介。 JS Daresでは、簡単なゲーム作りを通してJavaScriptを学ぶことができる。 最初は戦車を動かすプログラムからはじめて、少しずつ、自分のペースでレベルアップしていくことができるようだ。 すべてブラウザ上で完結するので環境を用意する手間もいらない。そろそろプログラミングを、という初学者の方はいかがだろうか。
スマホ対応の参考に。JavaScriptでウェブページがどのくらい拡大されているのかを取得する方法。
こんにちは。開発担当の林です。 iPhone / iPad のウェブブラウザでページを見ているとき、けっこうな割合でピンチイン・ピンチアウトすると思いますが、それがどのくらい拡大されているのかを取得する方法を書きます。 また、応用でピンチイン・ピンチアウトされても、見た目のサイズを維持するにはどのくらい拡大すれば良いかということにも触れたいと思います。 広告バナーなんかでよく使われてるアレの仕組みです。何かのお役に立てれば幸いです。 ウェブページがどのくらい拡大されているのかを取得する // ページの幅 ÷ 表示されている幅（この行だけでいいかな） var zoomer = document.body.clientWidth / window.innerWidth; // 以下で拡大率を目視できるでしょう alert( zoomer ); // 小数点がたくさんつくので、第二位までに丸め込
[JS]これは楽しい！スマフォUIのように下に引っ張るとリフレッシュするスクリプト -Hook.js
スマフォやタブレットのように、下に引っ張るとページをリフレッシュするjQueryのプラグインを紹介します。 Hook.js 最上部に戻ってからの上方向スクロールでもリフレッシュするようです。 普通のページではリフレッシュするシーンがあまりないですが、何かに使いたいな、、、 Hook.jsの使い方 実装は簡単で、2ステップです。 Step 1: 外部ファイル 「jquery.js」と当スクリプト・スタイルシートを外部ファイルとして記述します。 <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> <link rel="stylesheet" href="hook/hook.css" type="text/css" /> <script src="hook/hook.js"
スマートフォン対応でよく使うhtml、css、javascriptのまとめ
スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtml、css、javascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function
Using the command line
オープンソースのWebアプリ開発向けコードエディター「Brackets」Sprint 23が公開