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
130
Introduction to Ionic Framework
landish
0
83
PHPUnit
landish
0
91
Some Modern Tools for Developers
landish
0
120
Introduction to GIT
landish
0
48
Other Decks in Programming
See All in Programming
Lottieアニメーションをカスタマイズしてみた
tahia910
0
130
Domain-Driven Transformation
hschwentner
2
1.9k
SwiftUIで単方向アーキテクチャを導入して得られた成果
takuyaosawa
0
270
Grafana Cloudとソラカメ
devoc
0
170
Amazon Q Developer Proで効率化するAPI開発入門
seike460
PRO
0
110
PHPカンファレンス名古屋2025 タスク分解の試行錯誤〜レビュー負荷を下げるために〜
soichi
1
220
メンテが命: PHPフレームワークのコンテナ化とアップグレード戦略
shunta27
0
130
PHP ステートレス VS ステートフル 状態管理と並行性 / php-stateless-stateful
ytake
0
100
Flutter × Firebase Genkit で加速する生成 AI アプリ開発
coborinai
0
160
データの整合性を保つ非同期処理アーキテクチャパターン / Async Architecture Patterns
mokuo
49
17k
楽しく向き合う例外対応
okutsu
0
150
Rubyで始める関数型ドメインモデリング
shogo_tksk
0
120
Featured
See All Featured
Become a Pro
speakerdeck
PRO
26
5.1k
Building Flexible Design Systems
yeseniaperezcruz
328
38k
Side Projects
sachag
452
42k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.7k
YesSQL, Process and Tooling at Scale
rocio
172
14k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
9
450
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
6
550
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.8k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
How to Ace a Technical Interview
jacobian
276
23k
Building Your Own Lightsaber
phodgson
104
6.2k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
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
;)