내 .vscode 디렉터리를 들여다 보았을 때 일어난 일

세상을 포장하는 것 같습니다. 도움을 원하십니까?

Visual Studio Code , life 의 편집자 , meta 구절 및 모든 것. 표현력이 풍부한 웹 프런트엔드와 풍부한 API를 사용하여 thousands of extensions이 그 위에 구축되었습니다. 하지만 그들이 만드는 동안 우리가 별로 신경 쓰지 않는 곳에서 그것을 부수기도 합니다 👀.

최근에 확장자가 디스크에 저장되는 위치~/.vscode를 살펴보고 몇 가지 흥미로운 관찰 결과를 얻었습니다. VSCode 확장은 Node.js에서 제공되므로 다른 소식을 들을 수 있습니다Guy Fieri story. 이 게시물은 풍자적이지 않고 대신 웹 개발의 일반적인 주제인 불필요한 부풀림에 공감합니다.

GitHub 작업

GitHub Actions은 워크플로 구성에 대한 자동 완성 기능과 VSCode 내부의 작업과 상호 작용할 수 있는 편리한 패널을 제공합니다. 확장의 가중치는 3MB 미만이지만 소스 맵과 거대한 GIF를 추가하면 30MB가 넘습니다.

$ du -sh ~/.vscode/extensions/cschleiden.vscode-github-actions-*/* | sort -h | tail -n4
148K    /Users/kid/.vscode/extensions/cschleiden.vscode-github-actions-0.24.2/resources
7.9M    /Users/kid/.vscode/extensions/cschleiden.vscode-github-actions-0.24.2/dist
 22M    /Users/kid/.vscode/extensions/cschleiden.vscode-github-actions-0.24.2/media
 30M    total

$ du -sh ~/.vscode/extensions/cschleiden.vscode-github-actions-*/dist/* | sort -h
1.0M    /Users/kid/.vscode/extensions/cschleiden.vscode-github-actions-0.24.2/dist/extension-node.js
1.0M    /Users/kid/.vscode/extensions/cschleiden.vscode-github-actions-0.24.2/dist/extension-web.js
2.9M    /Users/kid/.vscode/extensions/cschleiden.vscode-github-actions-0.24.2/dist/extension-node.js.map
3.0M    /Users/kid/.vscode/extensions/cschleiden.vscode-github-actions-0.24.2/dist/extension-web.js.map
7.9M    total

리포지토리에 미디어 파일을 저장하는 것이 편리할 수 있지만 크기가 상당히 작은 경우에만 가능합니다. 너무 커지면 다른 브랜치나 외부 스토리지 🚚로 옮기는 것을 고려하십시오. 그러면 이런 실수를 덜 할 수 있습니다.

인라인 HTML

Inline HTML은 특수 JavaScript 템플릿 문자열에 대한 구문 강조 표시 및 IntelliSense를 제공합니다. 언어 서버가 관련되어 있으므로 확장 크기를 지배하는 종속성을 목격할 것으로 예상합니다. 대신 공간의 절반을 차지하는 신비한croc 파일이 있습니다.

$ du -sh ~/.vscode/extensions/pushqrdx.inline-html-*/* | sort -h | tail -n4
540K    /Users/kid/.vscode/extensions/pushqrdx.inline-html-0.3.5/docs
3.8M    /Users/kid/.vscode/extensions/pushqrdx.inline-html-0.3.5/node_modules
5.4M    /Users/kid/.vscode/extensions/pushqrdx.inline-html-0.3.5/croc
9.8M    total

검사 결과 파일 전송 도구인 croc 의 실행 파일로 보입니다.

$ file ~/.vscode/extensions/pushqrdx.inline-html-*/croc
/Users/kid/.vscode/extensions/pushqrdx.inline-html-0.3.5/croc: ELF 64-bit LSB executable, x86-64, version 1 (SYSV), statically linked, Go BuildID=6ad6eCjoCpDzAgT4fa1q/zgtYT6Jqz8Hudut1Z9pr/XktDKbBkBi9_EQ6gPETk/GnREkn9n1QHz_srmnqP8, stripped

확장 프로그램에서 언어 서버와 함께 IPC를 수행하는 데 사용한다면 🤔? 우리는 결코 모른다. 하지만 이 접근 방식에는 한 가지 문제가 있습니다. VSCode가 지원하는 모든 플랫폼에서 이식 가능하려면 Linux ELF로 컴파일하는 대신 Cosmopolitan으로 빌드해야 합니다.

와카타임

WakaTime은 프로그래밍 활동을 추적합니다. 무거운 짐은 외장WakaTime CLI으로 하니까 익스텐션 자체도 초경량임에 틀림없죠?

보라, VSCode 웹의 전체 빌드가 여기 있습니다 🤯:

$ du -sh ~/.vscode/extensions/wakatime.vscode-wakatime-*/{,.}* | sort -h | tail -n3
796K    /Users/kid/.vscode/extensions/wakatime.vscode-wakatime-19.0.1/dist
 53M    /Users/kid/.vscode/extensions/wakatime.vscode-wakatime-19.0.0/.vscode-test-web
 54M    total

소스 리포지토리에는 흔적이 없으며 패키지로 만들기 위해 모든 사람의 눈에 띄었을 것입니다. VSCode 설치가 중단될 경우를 대비하여 백업이 준비되어 있으므로 안심할 수 있으므로 반드시 나쁜 것은 아닙니다. 또는 확장 프로그램에서 기대할 수 있는 마지막 작업입니다 😅.

결론

Vim, Emacs, Zsh 및 Fish와 같은 많은 개발자 도구는 Git 리포지토리에서 직접 확장/플러그인을 가져오므로 막대한 자산을 눈에 띄게 만듭니다. VSCode 확장에는 패키징 단계가 필요하므로 개발자가 최종 번들을 가지치기할 수 있습니다. 오늘날 우리가 보는 부풀림으로 이어지는 것은 감독입니다. 우리는 Alpine으로 Docker 이미지를 빌드하는 것처럼 더 잘할 수 있습니다💪. 대역폭과 디스크 공간은 우리의 시간만큼이나 소중합니다.

확장 설치 크기에 대한 정보를 제공하는 VSCode를 제안할 수 있습니다submitted an issue. 이것이 인지도를 높일 수 있기를 바랍니다 🤞.

👋 Hi DEV Community! This is my first post here, suggestions are very much appreciated ✨!
The first version of this post was written half a month ago, posted on my Notion page. I decided it was unreadable and rewrote much of the content, and ended up with this mix of boring story and unfunny jokes 🙈.