Webnotes

Notes around : Web, Browser, network, etc...

WebVitals
Measuring performance
Browser centric metrics (Load Page, TTFB) VS User centric metrics (FCP, LCP, CLS, FIP)
TTI (TimeToInteractive) : The time it takes for a user to have a first interaction, times between the content loading (HTTP - REQUEST/RESPONSE) + time it takes to the browser to paint (DOM + HTML + CSS) and make interactive the page (JS)
TTFB (Time To First Byte) : Time for the client to receive the first byte of data from the network
FCP (First contentful paint) : Time it takes for the browser to render the first element after a navigation
LCP (Largest content paint) : Time it takes to load and render the main page content
CLS (Cumulative Layout shift) : Measure visual stability to avoid layout/element shift
FID (First Input Delay) : Times between the user interaction and the event + handler being treated by javascript
INP (Interaction next paint) : link
Latency : Time between a packet is sent and when it is received in (ms)
Speed index % : How much of the final rendering was happend at each point of a timeline
RUM (Real User Metrics) : The metrics of the users, opposed to labs metrics

XSS : Inject some malicous script, that will get executed on target clients. Owasp XSS
CSRF : Get the credentials of site to fake a user CSRF
UI Redressing : Make an invisible button when the user click somewhere he clicks on the invisible button Clickjacking
(M)an (I)n (T)he (M)iddle : Someone intercept the communication between two endpoint Man in the middle

PNG : Transparency, heavy format, lossless compression
JPEG : Lossy compression, support progressive rendering
WebP : Transparency + progressive rendering, better algo (Lossy & Lossless modes)
Avif : HDR + Transparency