The critical rendering path decides your first paint

A stylesheet in the head blocks rendering until it has loaded, and a script without defer blocks parsing until it has executed. Both are correct behaviour and both mean the page cannot paint while a network request is outstanding.

<!-- blocks parsing -->
<script src="/js/app.js"></script>

<!-- downloads in parallel, runs after parsing, keeps order -->
<script src="/js/app.js" defer></script>

<!-- downloads in parallel, runs whenever ready, order not guaranteed -->
<script src="/js/analytics.js" async></script>

defer is almost always the right answer for application code because it preserves execution order; async suits an independent third-party tag and nothing else. For CSS the equivalent move is inlining the styles needed for what is visible and loading the rest asynchronously — more work, and the only thing that improves first paint on a slow connection.