Submit Search
Upload
【社内LT】JSあれこれ -読み込み編-
•
0 likes
•
611 views
Vitalify.Inc
Follow
Design
Report
Share
Report
Share
1 of 9
Download now
Download to read offline
Recommended
Do not use document.write
Do not use document.write
Haruki Okada
https://cyberagent.connpass.com/event/70489/
Password security 2
Password security 2
Joe_noh
パスワード認証に関すること その2 メインは"Security through Obesity" 一部の英数字フォントが意図しないものになってしまった
芸術情報演習デザイン(Web) 第8回: CSSフレームワークを使う
芸術情報演習デザイン(Web) 第8回: CSSフレームワークを使う
Atsushi Tadokoro
ブラウザとWebサーバとXSSの話@Shibuya.xss
ブラウザとWebサーバとXSSの話@Shibuya.xss
Toshiharu Sugiyama
Shibuya.XSS Technical Talk #5 「このオブジェクトは ここ.」 デザインテンプレートはここ(宣伝):http://sagittarius.dip.jp/toshi/template.php
CSP Lv.2の話
CSP Lv.2の話
Yu Yagihashi
#ssmjp 2014/10 XSSの運用の話 間違いなどありましたら @yagihashoo まで。 ## 10/28 9:26追記 nonce-value、規格上はBase64だよ!という指摘をいただいたのでスライド18-19を修正しました。 詳細は以下をご覧ください。 http://www.w3.org/TR/CSP2/#source-list-valid-nonces ## 10/29 15:00追記 Path matchingの例示について間違いがあったためスライド14を修正しました。
【Hpcstudy】みんな、ベンチマークどうやってるの?
【Hpcstudy】みんな、ベンチマークどうやってるの?
Seiichiro Ishida
#hpcstudy のLT資料です。
Pjax1
Pjax1
Kindai University
Ma gician <wide version> @meguro.es 2019/10/10
Ma gician <wide version> @meguro.es 2019/10/10
Eucen Stew
世界中のフロントエンダーの残業時間を減らす、新しい JavaScript フロントエンドフレームワークの LT 用資料です。
Recommended
Do not use document.write
Do not use document.write
Haruki Okada
https://cyberagent.connpass.com/event/70489/
Password security 2
Password security 2
Joe_noh
パスワード認証に関すること その2 メインは"Security through Obesity" 一部の英数字フォントが意図しないものになってしまった
芸術情報演習デザイン(Web) 第8回: CSSフレームワークを使う
芸術情報演習デザイン(Web) 第8回: CSSフレームワークを使う
Atsushi Tadokoro
ブラウザとWebサーバとXSSの話@Shibuya.xss
ブラウザとWebサーバとXSSの話@Shibuya.xss
Toshiharu Sugiyama
Shibuya.XSS Technical Talk #5 「このオブジェクトは ここ.」 デザインテンプレートはここ(宣伝):http://sagittarius.dip.jp/toshi/template.php
CSP Lv.2の話
CSP Lv.2の話
Yu Yagihashi
#ssmjp 2014/10 XSSの運用の話 間違いなどありましたら @yagihashoo まで。 ## 10/28 9:26追記 nonce-value、規格上はBase64だよ!という指摘をいただいたのでスライド18-19を修正しました。 詳細は以下をご覧ください。 http://www.w3.org/TR/CSP2/#source-list-valid-nonces ## 10/29 15:00追記 Path matchingの例示について間違いがあったためスライド14を修正しました。
【Hpcstudy】みんな、ベンチマークどうやってるの?
【Hpcstudy】みんな、ベンチマークどうやってるの?
Seiichiro Ishida
#hpcstudy のLT資料です。
Pjax1
Pjax1
Kindai University
Ma gician <wide version> @meguro.es 2019/10/10
Ma gician <wide version> @meguro.es 2019/10/10
Eucen Stew
世界中のフロントエンダーの残業時間を減らす、新しい JavaScript フロントエンドフレームワークの LT 用資料です。
俺 と ご褒美 Bot
俺 と ご褒美 Bot
Masayuki KaToH
俺 と ご褒美 bot - CIにはちゃんとアカウントを -
Zealup - React
Zealup - React
Masahiro Yanou
React.js & AngularJS 勉強会での資料です。 目標管理システムZealupはReactで作ってあります。
俺とモデリング
俺とモデリング
Masayuki KaToH
俺とモデリング オレオレ図で大丈夫か
俺とホットキー
俺とホットキー
Masayuki KaToH
俺とホットキー
Reactテストに役立つ実装の工夫
Reactテストに役立つ実装の工夫
鉄平 土佐
Modern Web App LT! freee x WACUL at 2016/6/10
メカニカルキーボード使い始めたら捗った話
メカニカルキーボード使い始めたら捗った話
pmw1415
2015/12/12に開催されたプログラミング生放送勉強会第38回@名古屋で発表させて貰ったLT資料です。
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
Masayuki KaToH
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
Go で Unit Test をやってみた
Go で Unit Test をやってみた
Masahiro Yanou
Go言語とReactで考えるWebアプリの「いい感じなURL設計」入門 の勉強会での LT 資料です。 Go で Webアプリケーションを作成する際の UnitTest の方法の一例をご紹介。
Ha4goもくもく報告2016年11月分
Ha4goもくもく報告2016年11月分
Masayuki KaToH
Ha4goもくもく報告2016年11月分
俺と LightSail 概要と使ってみた
俺と LightSail 概要と使ってみた
Masayuki KaToH
俺と LightSail 概要と使ってみた
情報サイトの金持ちさんと貧乏さん
情報サイトの金持ちさんと貧乏さん
Atsufumi Yoshikawa
情報サイトを成功させる大切なポイントは、根本的なアプローチ。
超初心者向け・オンライン勉強会のススメ(WordCamp Tokyo 2016 LT スライド)
超初心者向け・オンライン勉強会のススメ(WordCamp Tokyo 2016 LT スライド)
Hijili Kosugi
#wctokyo のライトニングトークでお話した際のスライドです。 おかげさまで第3位として選んでいただきました。 オンラインの勉強会は楽しいですよ(/・ω・)/
Web制作・運用会社に必要なCDNサービスとは?
Web制作・運用会社に必要なCDNサービスとは?
J-Stream Inc.
WordCamp Tokyo LT
テーマ・プラグイン開発の光と闇 #wctokyo
テーマ・プラグイン開発の光と闇 #wctokyo
Hidekazu Ishikawa
WordCampTokyo 2016 LT スライド
Client-Side Deep Learning
Client-Side Deep Learning
Shuichi Tsutsumi
5 min talk @ try! Swift Tokyo 2017
YUI
YUI
Tatsuya Sasaki
SEOとJava Script。 〜文書構造とチームと、時々、闇〜
SEOとJava Script。 〜文書構造とチームと、時々、闇〜
Yuki Minakawa
2016/01/16に開催されたWDF研修「半歩先のSEOで効率よく結果を出そう」で発表させて頂いたLTです。
HTMLのアウトラインを意識しよう
HTMLのアウトラインを意識しよう
shigetoshi komatsu
アウトラインを意識したHTMLコーディングをLPの作成行程を例に解説
jQuery Mobile 最新情報 & Tips
jQuery Mobile 最新情報 & Tips
yoshikawa_t
3/15のWeb Cat Studio(リクルートエージェント)で行われた「jQuery Mobile 最新情報 & Tips」のセッション資料です。
Antのススメ
Antのススメ
Tatsumi Naganuma
Javaのビルド自動化ツールApache Antは、HTML(XML)やJavaScriptに慣れたWebプログラマー、デザイナーに優しいツールです。Mozilla&NSEG合同勉強会(NSEG第17回勉強会 2011年7月23日)の発表資料。
アプリコンテスト
アプリコンテスト
Tomonori Yamada
jsライブラリで実装する効率的なWeb制作
jsライブラリで実装する効率的なWeb制作
西畑 一馬
CSS Nite in Osaka vol7での公演資料になります
More Related Content
Viewers also liked
俺 と ご褒美 Bot
俺 と ご褒美 Bot
Masayuki KaToH
俺 と ご褒美 bot - CIにはちゃんとアカウントを -
Zealup - React
Zealup - React
Masahiro Yanou
React.js & AngularJS 勉強会での資料です。 目標管理システムZealupはReactで作ってあります。
俺とモデリング
俺とモデリング
Masayuki KaToH
俺とモデリング オレオレ図で大丈夫か
俺とホットキー
俺とホットキー
Masayuki KaToH
俺とホットキー
Reactテストに役立つ実装の工夫
Reactテストに役立つ実装の工夫
鉄平 土佐
Modern Web App LT! freee x WACUL at 2016/6/10
メカニカルキーボード使い始めたら捗った話
メカニカルキーボード使い始めたら捗った話
pmw1415
2015/12/12に開催されたプログラミング生放送勉強会第38回@名古屋で発表させて貰ったLT資料です。
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
Masayuki KaToH
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
Go で Unit Test をやってみた
Go で Unit Test をやってみた
Masahiro Yanou
Go言語とReactで考えるWebアプリの「いい感じなURL設計」入門 の勉強会での LT 資料です。 Go で Webアプリケーションを作成する際の UnitTest の方法の一例をご紹介。
Ha4goもくもく報告2016年11月分
Ha4goもくもく報告2016年11月分
Masayuki KaToH
Ha4goもくもく報告2016年11月分
俺と LightSail 概要と使ってみた
俺と LightSail 概要と使ってみた
Masayuki KaToH
俺と LightSail 概要と使ってみた
情報サイトの金持ちさんと貧乏さん
情報サイトの金持ちさんと貧乏さん
Atsufumi Yoshikawa
情報サイトを成功させる大切なポイントは、根本的なアプローチ。
超初心者向け・オンライン勉強会のススメ(WordCamp Tokyo 2016 LT スライド)
超初心者向け・オンライン勉強会のススメ(WordCamp Tokyo 2016 LT スライド)
Hijili Kosugi
#wctokyo のライトニングトークでお話した際のスライドです。 おかげさまで第3位として選んでいただきました。 オンラインの勉強会は楽しいですよ(/・ω・)/
Web制作・運用会社に必要なCDNサービスとは?
Web制作・運用会社に必要なCDNサービスとは?
J-Stream Inc.
WordCamp Tokyo LT
テーマ・プラグイン開発の光と闇 #wctokyo
テーマ・プラグイン開発の光と闇 #wctokyo
Hidekazu Ishikawa
WordCampTokyo 2016 LT スライド
Client-Side Deep Learning
Client-Side Deep Learning
Shuichi Tsutsumi
5 min talk @ try! Swift Tokyo 2017
Viewers also liked
(15)
俺 と ご褒美 Bot
俺 と ご褒美 Bot
Zealup - React
Zealup - React
俺とモデリング
俺とモデリング
俺とホットキー
俺とホットキー
Reactテストに役立つ実装の工夫
Reactテストに役立つ実装の工夫
メカニカルキーボード使い始めたら捗った話
メカニカルキーボード使い始めたら捗った話
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
Go で Unit Test をやってみた
Go で Unit Test をやってみた
Ha4goもくもく報告2016年11月分
Ha4goもくもく報告2016年11月分
俺と LightSail 概要と使ってみた
俺と LightSail 概要と使ってみた
情報サイトの金持ちさんと貧乏さん
情報サイトの金持ちさんと貧乏さん
超初心者向け・オンライン勉強会のススメ(WordCamp Tokyo 2016 LT スライド)
超初心者向け・オンライン勉強会のススメ(WordCamp Tokyo 2016 LT スライド)
Web制作・運用会社に必要なCDNサービスとは?
Web制作・運用会社に必要なCDNサービスとは?
テーマ・プラグイン開発の光と闇 #wctokyo
テーマ・プラグイン開発の光と闇 #wctokyo
Client-Side Deep Learning
Client-Side Deep Learning
Similar to 【社内LT】JSあれこれ -読み込み編-
YUI
YUI
Tatsuya Sasaki
SEOとJava Script。 〜文書構造とチームと、時々、闇〜
SEOとJava Script。 〜文書構造とチームと、時々、闇〜
Yuki Minakawa
2016/01/16に開催されたWDF研修「半歩先のSEOで効率よく結果を出そう」で発表させて頂いたLTです。
HTMLのアウトラインを意識しよう
HTMLのアウトラインを意識しよう
shigetoshi komatsu
アウトラインを意識したHTMLコーディングをLPの作成行程を例に解説
jQuery Mobile 最新情報 & Tips
jQuery Mobile 最新情報 & Tips
yoshikawa_t
3/15のWeb Cat Studio(リクルートエージェント)で行われた「jQuery Mobile 最新情報 & Tips」のセッション資料です。
Antのススメ
Antのススメ
Tatsumi Naganuma
Javaのビルド自動化ツールApache Antは、HTML(XML)やJavaScriptに慣れたWebプログラマー、デザイナーに優しいツールです。Mozilla&NSEG合同勉強会(NSEG第17回勉強会 2011年7月23日)の発表資料。
アプリコンテスト
アプリコンテスト
Tomonori Yamada
jsライブラリで実装する効率的なWeb制作
jsライブラリで実装する効率的なWeb制作
西畑 一馬
CSS Nite in Osaka vol7での公演資料になります
今からハジメるHTML5マークアップ
今からハジメるHTML5マークアップ
SwapSkills
SwapSkills2010 vol2 羽田野太巳
Java Script勉強会
Java Script勉強会
guestc8c3a73
webを飾る技術
webを飾る技術
ina job
HTML ,CSS ,XML ,XSLT,JavaScript Japanese Only
ScaLa+Liftとか
ScaLa+Liftとか
youku
需要があるかわからないし、前回のスライドと共通部分多いけど一応。
SDLoader SeasarCon 2009 Whire
SDLoader SeasarCon 2009 Whire
Akio Katayama
SeasarCon2009 Whiteでの発表スライド
Java script4
Java script4
Kiminari Homma
Learning jQuery
Learning jQuery
taiju higashi
デザイナ向け「はじめてのjQuery」 http://d.hatena.ne.jp/jdg/20081127/1227747020
Java Script4
Java Script4
Kiminari Homma
Web制作勉強会 #2
Web制作勉強会 #2
Moto Yan
Web制作勉強会第二回の資料 jQuery入門です。
情報編集 (web) 第2回:HTML入門
情報編集 (web) 第2回:HTML入門
Atsushi Tadokoro
Similar to 【社内LT】JSあれこれ -読み込み編-
(17)
YUI
YUI
SEOとJava Script。 〜文書構造とチームと、時々、闇〜
SEOとJava Script。 〜文書構造とチームと、時々、闇〜
HTMLのアウトラインを意識しよう
HTMLのアウトラインを意識しよう
jQuery Mobile 最新情報 & Tips
jQuery Mobile 最新情報 & Tips
Antのススメ
Antのススメ
アプリコンテスト
アプリコンテスト
jsライブラリで実装する効率的なWeb制作
jsライブラリで実装する効率的なWeb制作
今からハジメるHTML5マークアップ
今からハジメるHTML5マークアップ
Java Script勉強会
Java Script勉強会
webを飾る技術
webを飾る技術
ScaLa+Liftとか
ScaLa+Liftとか
SDLoader SeasarCon 2009 Whire
SDLoader SeasarCon 2009 Whire
Java script4
Java script4
Learning jQuery
Learning jQuery
Java Script4
Java Script4
Web制作勉強会 #2
Web制作勉強会 #2
情報編集 (web) 第2回:HTML入門
情報編集 (web) 第2回:HTML入門
More from Vitalify.Inc
Android5.0 新osでの変更点まとめ
Android5.0 新osでの変更点まとめ
Vitalify.Inc
Android5.0 新osによる新デザイン、新機能のまとめ
iPhone6 6Plus
iPhone6 6Plus
Vitalify.Inc
2014/09/25時点で公表されている情報となります。
Firefox os
Firefox os
Vitalify.Inc
【社内LT】役立ちツール&機能3選 20140410
【社内LT】役立ちツール&機能3選 20140410
Vitalify.Inc
Linux基礎
Linux基礎
Vitalify.Inc
【社内LT】iPhoneアプリ開発のすすめ
【社内LT】iPhoneアプリ開発のすすめ
Vitalify.Inc
【社内LT】ドMディレクターと呼ばれた件について原因を5つくらい考えてみる
【社内LT】ドMディレクターと呼ばれた件について原因を5つくらい考えてみる
Vitalify.Inc
【社内LT】ブラウザのDeveloper Toolについて
【社内LT】ブラウザのDeveloper Toolについて
Vitalify.Inc
/*Developer Toolでできること*/ /*各ブラウザのDeveloper Toolについて*/
【社内LT】バイタリフィ ライトニングトーク -セキュリティについて-
【社内LT】バイタリフィ ライトニングトーク -セキュリティについて-
Vitalify.Inc
【社内LT】DBとは
【社内LT】DBとは
Vitalify.Inc
DBの基礎。 そもそもその他ファイルシステムではなくなぜDBを使うのだろう? という疑問など、利用目的や考え方について纏めています。
【社内LT】AdobeAIRでアプリ
【社内LT】AdobeAIRでアプリ
Vitalify.Inc
【社内LT】Webにおける適切な画像形式の選び方
【社内LT】Webにおける適切な画像形式の選び方
Vitalify.Inc
iOS/Androidアプリ内決済を利用しよう! 課金機能で気をつけたい5つのこと
iOS/Androidアプリ内決済を利用しよう! 課金機能で気をつけたい5つのこと
Vitalify.Inc
株式会社バイタリフィ主催勉強会「Study スマホ!スマートフォンアプリ・ゲーム開発ナレッジ共有セミナー #Studyスマホ」にて発表したスライドです。 Study スマホ!スマートフォンアプリ・ゲーム開発ナレッジ共有セミナー #Studyスマホ http://atnd.org/events/45094
Mavericks新機能について
Mavericks新機能について
Vitalify.Inc
Mac OS X Mavericks(10.9)の新機能について調べた資料になります。 実際に使う場合を考えて作成してみました。
いまさら聞けない?フラットデザインまとめ
いまさら聞けない?フラットデザインまとめ
Vitalify.Inc
ここ1~2年のUIトレンドである「フラットデザイン」について簡単ですがまとめました。 <目次> ・フラットデザインとは? ・フラットデザインのいいところ、わるいところ ・わかりやすい?わかりにくい?フラットデザイン ・進化するフラットデザイン
2013年上期流行サービス
2013年上期流行サービス
Vitalify.Inc
株式会社バイタリフィ事業紹介資料
株式会社バイタリフィ事業紹介資料
Vitalify.Inc
株式会社バイタリフィの事業紹介資料です。(2013年7月18日現在)
ウェアラブルデバイス
ウェアラブルデバイス
Vitalify.Inc
2013/10/17 ウェアラブルデバイスまとめ。 Google Glass, Galaxy Gear(Samsung), FuelBand(NIKE), Nismo Watch(日産), わんダント(富士通), カラダフィット(ルナルナ)を取り上げています。
iphone5s 5c
iphone5s 5c
Vitalify.Inc
2013/09/19時点で公表されている情報となります。
iOS7新機能&デザインまとめ
iOS7新機能&デザインまとめ
Vitalify.Inc
2013/08/22時点で公表されている情報となります。 弊社ブログのほうでも機能を紹介しております。 よろしければご覧ください。 http://vitalify.jp/blog/2013/08/ios7_function.html
More from Vitalify.Inc
(20)
Android5.0 新osでの変更点まとめ
Android5.0 新osでの変更点まとめ
iPhone6 6Plus
iPhone6 6Plus
Firefox os
Firefox os
【社内LT】役立ちツール&機能3選 20140410
【社内LT】役立ちツール&機能3選 20140410
Linux基礎
Linux基礎
【社内LT】iPhoneアプリ開発のすすめ
【社内LT】iPhoneアプリ開発のすすめ
【社内LT】ドMディレクターと呼ばれた件について原因を5つくらい考えてみる
【社内LT】ドMディレクターと呼ばれた件について原因を5つくらい考えてみる
【社内LT】ブラウザのDeveloper Toolについて
【社内LT】ブラウザのDeveloper Toolについて
【社内LT】バイタリフィ ライトニングトーク -セキュリティについて-
【社内LT】バイタリフィ ライトニングトーク -セキュリティについて-
【社内LT】DBとは
【社内LT】DBとは
【社内LT】AdobeAIRでアプリ
【社内LT】AdobeAIRでアプリ
【社内LT】Webにおける適切な画像形式の選び方
【社内LT】Webにおける適切な画像形式の選び方
iOS/Androidアプリ内決済を利用しよう! 課金機能で気をつけたい5つのこと
iOS/Androidアプリ内決済を利用しよう! 課金機能で気をつけたい5つのこと
Mavericks新機能について
Mavericks新機能について
いまさら聞けない?フラットデザインまとめ
いまさら聞けない?フラットデザインまとめ
2013年上期流行サービス
2013年上期流行サービス
株式会社バイタリフィ事業紹介資料
株式会社バイタリフィ事業紹介資料
ウェアラブルデバイス
ウェアラブルデバイス
iphone5s 5c
iphone5s 5c
iOS7新機能&デザインまとめ
iOS7新機能&デザインまとめ
【社内LT】JSあれこれ -読み込み編-
1.
JavaScript あれこれ 読み込み編 WP部 うえはら
2.
Q.外部JSを読み込む時って どの位置に書いてもいいの? <html> </html> <script>…</script>
3.
Q.外部JSを読み込む時って どの位置に書いてもいいの? A.よろしくないです。 処理の内容に沿って、適切な位置で 読み込むのがいいよ!
4.
<!DOCTYPE html> <html lang="ja"> <head> <meta
charset="utf-8"> <title>ウェッブサイト</title> ① headの中 </head> <body> ② bodyの中 <div id=“lightbox“>ふわっと出る。</div> ③ body閉じタグの直前 </body> </html>
5.
たとえばJSでできること 1. User Agent
によるデバイス判別 2.カルーセル、ライトボックス .etc 3.アクセス解析(Google Aalytics)
6.
1.UA判別を読み込む位置は ① headの中 ブラウザがhtmlの描画をするよりも先に 処理が走る。 UA判別は、表示よりも先に、デバイスの 判別の為に行うことが目的なので、ここ に書く。
7.
2.ライトボックスを読み込む位置は ② bodyの中 もっと正しくは、処理を当てるhtmlタグ (Dom要素)の直前。 に、ライブラリを動作させるscriptを書 く。 ※書く人の趣味にもよる
8.
3. Google Aalyticsを読み込む位置は ③
body閉じタグの直前 htmlが全て読み込まれたあとに処理をし たいので、ここ。 全ページ共通のものや、htmlタグ (Dom要素)が「存在している」状態で 処理する必要があるJSを入れよう。
9.
レンダリング (htmlの読み込み→表示) の順番とJSで行う処理との 関係を考えて入れるのが良い。 めざせパフォーマンス向上!
Download now