Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Anatomy Of The Web
Search
landish
December 02, 2015
Programming
1
170
Anatomy Of The Web
landish
December 02, 2015
Tweet
Share
More Decks by landish
See All by landish
Markdown
landish
0
120
Introduction to Ionic Framework
landish
0
83
PHPUnit
landish
0
89
Some Modern Tools for Developers
landish
0
120
Introduction to GIT
landish
0
46
Other Decks in Programming
See All in Programming
JaSST 24 九州:ワークショップ(は除く)実践!マインドマップを活用したソフトウェアテスト+活用事例
satohiroyuki
0
270
アジャイルを支えるテストアーキテクチャ設計/Test Architecting for Agile
goyoki
7
2.8k
Vue3の一歩踏み込んだパフォーマンスチューニング2024
hal_spidernight
3
3.1k
Boost Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
890
とにかくAWS GameDay!AWSは世界の共通言語! / Anyway, AWS GameDay! AWS is the world's lingua franca!
seike460
PRO
1
560
Golang と Erlang
taiyow
8
1.9k
レガシーな Android アプリのリアーキテクチャ戦略
oidy
1
170
讓數據說話:用 Python、Prometheus 和 Grafana 講故事
eddie
0
350
CSC305 Lecture 13
javiergs
PRO
0
130
飲食業界向けマルチプロダクトを実現させる開発体制とリアルな現状
hiroya0601
1
400
[PyCon Korea 2024 Keynote] 커뮤니티와 파이썬, 그리고 우리
beomi
0
110
僕がつくった48個のWebサービス達
yusukebe
18
17k
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
136
6.6k
Measuring & Analyzing Core Web Vitals
bluesmoon
1
41
Git: the NoSQL Database
bkeepers
PRO
425
64k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Gamification - CAS2011
davidbonilla
80
5k
Why Our Code Smells
bkeepers
PRO
334
57k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
46
2.1k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
Unsuck your backbone
ammeep
668
57k
How GitHub (no longer) Works
holman
311
140k
Typedesign – Prime Four
hannesfritz
39
2.4k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
664
120k
Transcript
Lado Lomidze www.singular.uk ANATOMY OF THE WEB
WHAT IS A WEB-PAGE?
WEB-PAGE IS A HUMAN…
… WITH HEAD AND BODY
HTML
HTML = BONES
CSS
CSS = SKIN COLOR, HAIR, HEIGHT….
JAVASCRIPT
JAVASCRIPT = ATHLETIC
JAVASCRIPT? YEEES!
SOMETIMES… …WEB CAN BE… SICK/SLOW
None
None
POSSIBLE REASONS - NOT OPTIMISED CODE (DB/BACKEND) - HUGE IMAGES
- REDNER-BLOCKING CSS & JS - MULTIPLE HTTP REQUESTS - HOSTING - CAUCASUS ONLINE
None
ANALYSE
None
https://developers.google.com/speed/pagespeed/insights/
SHOWCASE
GULP http://gulpjs.com/
NODE.JS
NODE.JS - “Server-Side Javascript” https://nodejs.org/
NPM - Node Package Manager https://www.npmjs.com/
/NODE_MODULES & /PACKAGE.JSON /node_modules Directory to store all node.js modules
/package.json Node.js specification file
NPM COMMANDS npm install <package-name> —save Install node package by
name Example: npm install gulp —save npm update Update all packages npm help Get some help
INSTALL GULP npm install gulp -g
gulpfile.js
GULP TASKS gulp <your task-name> Run gulp task by name
Example: gulp css gulp js gulp watch
IMAGE OPTIMISATION https://tinypng.com/
IMAGE OPTIMISATION https://github.com/imagemin/imagemin imagemin
YOUR ASSISTANTS
;)