javascript - Parser blocking vs render blocking -

i've been reading google developers documentation on optimizing web performance. i'm little confused terminology used there. both css , javascript files block dom construction. but, css called render-blocking whereas javascript called parser-blocking. difference in 'parser-blocking' , 'render-blocking' terms? or same , terminology interchangeably used?

imagine html page has 2 <script src="..."> elements. parser sees first one. has stop* parsing while fetches , executes javascript, because might contain document.write() method calls fundamentally change how subsequent markup parsed. fetching resources on internet comparatively slower other things browser does, sits waiting nothing do. js arrive, executes , parser can move on. sees second <script src="..."> tag , has go through whole process of waiting resource load again. it's sequential process, , that's parser blocking.

css resources different. when parser sees stylesheet load, issues request server, , moves on. if there other resources load, these can fetched in parallel (subject http restrictions). when css resources loaded , ready can page painted on screen. that's render blocking, , because fetches in parallel, it's less serious slow down.

---

* parser blocking not quite simple in modern browsers. have ability tentatively parse following html in hope script, when loads , executes, doesn't mess subsequent parsing, or if does, same resources still required loaded. can still have out work if script awkward.