Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Nawet nie wiesz ile potrafi Twoja przeglądarka

Avatar for Bartłomiej Krztuk Bartłomiej Krztuk
September 23, 2017
Programming
120
0

Nawet nie wiesz ile potrafi Twoja przeglądarka

Avatar for Bartłomiej Krztuk

Bartłomiej Krztuk

September 23, 2017

Other Decks in Programming

See All in Programming
RAG の “R” を Swift で覗いてみる 〜「意味から探す」検索の仕組み〜
Avatar for Nao-RandD nao_randd
0
170
Compiling a real-world CLI tool to native with Static Hermes
Avatar for Tzvetan Mikov tmikov2023
0
120
自サークルのIdPからログアウトできるようになるまで
Avatar for taiseiue taiseiue
1
140
なぜCTOを降りてFDEを選んだのか？〜なぜプロダクト企業がFDEで顧客の現場に踏み込むのか〜
Avatar for ryuta sakamoto gonta
1
220
When benchmarks go bad - what I learned from measuring performance wrong
Avatar for Holly Cummins hollycummins
0
220
コードで差別化できない時代の ソフトウェアエンジニアリング / Software Engineering in an Era Where Code Doesn’t Differentiate
Avatar for Naoki Kishida kishida
2
180
APNsからLive Activityを開始する話
Avatar for Ryotaro Onoue yumnumm
0
170
The Rails Doctrine Decade
Avatar for Koichi ITO koic
2
590
Simple Storage Service(S3) is not simple
Avatar for Yura Iwatsuka iwatsukayura
0
290
Workers Cache を知る
Avatar for syumai syumai
0
370
全ての永続トークンを、生まれる前に消し去りたい！
Avatar for sylph01 sylph01
2
970
HTML-in-Canvasで作る未来のWeb UI表現
Avatar for IKEDA Yasunobu clockmaker
5
5.1k

Featured

See All Featured
KATA
Avatar for Megan Lloyd mclloyd
PRO
35
16k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
184
10k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
464
34k
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
1
570
A better future with KSS
Avatar for Kyle Neath kneath
240
18k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.8k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.6k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.9k
Navigating the moral maze — ethical principles for Al-driven product design
Avatar for Skipper Chong Warson skipperchong
2
630
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
39
3.5k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.8k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
37
6.6k

Transcript

  1. 2017 NAWET NIE WIESZ ILE POTRAFI TWOJA PRZEGLĄDARKA

  2. 2017 CZEŚĆ

  3. 2017 CZEŚĆ Bartłomiej Krztuk Lead E-Commerce Developer @ Samlerhuset @BartekKrztuk

    krztuk.pl

  4. 2017

  5. 2017 Dlaczego Chrome? •Zaawansowany debugger JavaScript •Ogromna ilość rozszerzeń w

    tym rozszerzenia dedykowane np. Dla Angular, React, Vue •Wbudowany emulator urządzeń

  6. 2017 #0 T-REX GAME

  7. 2017

  8. 2017 #1 CONTENT EDITABLE

  9. 2017 Sprawdź jak układa się tekst na żywo document.body.contentEditable=true (Chrome)

    document.designMode = “on” (Safari)

  10. 2017 #2 DEVICE EMULATION MODE

  11. 2017 Device emulation - reprezentuje przybliżony widok na urządzeniu mobilnym

    - wspiera ekrany Retina, HDPI (4x, 2x, 1,7x itp) - Dotyk (touch events) - Geolokalizacja - Orientacja urządzenia (widok horyzontalny, wertykalny)

  12. 2017 #3 ZRZUTY EKRANU

  13. 2017 Full page screenshot - CTRL/CMD + SHIFT + P

    (Command menu) - Capture screenshot - Capture full size screenshot Działa także w trybie mobilnym

  14. 2017 #4 PALETA KOLORÓW

  15. 2017 Color chooser - Aktualna paleta kolorów - Łatwa konwersja

    RGB ➝ HEX - Color picker (próbnik kolorów)

  16. 2017 #5 NIEUŻYWANY CSS/JAVASCRIPT

  17. 2017 Coverage - Dev tools ➝ dodaj zakładkę - Coverage

  18. 2017 #6 BLOKOWANIE ZASOBÓW

  19. 2017 Resource blocking - Dev tools ➝ Network - Start

    recording - Block request URL

  20. 2017 #7 TAŚMA FILMOWA

  21. 2017 Film strip - Dev tools ➝ Network - Camera

    icon

  22. 2017 API

  23. 2017 #8 BATTERY API

  24. 2017 Poziom baterii Navigator.getBattery() Navigator.battery

  25. 2017 #9 VIBRATION API

  26. 2017 Vibration window.navigator.vibrate(200); window.navigator.vibrate([200]); window.navigator.vibrate([200,100,200])

  27. 2017 #10 SPEECH API

  28. 2017 Speech API var msg = new SpeechSynthesisUtterance('Hello World'); window.speechSynthesis.speak(msg);

    msg.lang = ‘pl-PL’ msg.rate = ‘0.7’ msg.text = ‘Witaj’

  29. 2017 #00 TABAGOTCHI

  30. 2017 Jak radzić sobie z zakładkami http://tabagotchi.com/

  31. 2017 PYTANIA?

  32. 2017 PREZENTACJA DOSTĘPNA NA www.krztuk.pl

  33. 2017 DZIĘKUJĘ ZA UWAGĘ