JavaScript, jQuery 한줄짜리 min 소스코드 원본처럼 이쁘게

제목을 어떻게 써야 이 고민을 하시는 분들이 오실까~ 하다가 좀 이상하게 쓰긴 했는데 ㅋㅋㅋ

저의 경험으로 빗대면 제가 처음 *.min.js 파일을 접했을때 아니 왜 min 파일은 다 1줄이지.. 압축의 목적인가...

그렇다면 min 파일은 어떻게 만들고 min파일만 있을경우 원본 소스는 어떻게 보지.. 라는 생각이였습니다.

그래서 제목을.. 초보자들이 검색할만한 키워드로 했습니다 ㅎㅎ

아무튼! 

min 파일을 원본 소스코드 처럼 보시려는 이유는 분석해보고 싶거나 조금 고치기 위해서 하시는 분들이 많을텐데요~

다행히도 이를 바로 수행해주는 매우 좋은 사이트가 있습니다.

사이트 자체적으로나 기능적으로나 UI 적으로나 너무 단순해서 그냥 접속해서 보시면 바로 아실거예요 ㅋㅋ

http://jsbeautifier.org/

사이트 도메인 위와 같습니다. 클릭하시면 이동되요~

도메인 보면 이름도 참 직관적이죠 ㅋㅋ js를 beautiful하게 해주는 er ㅋㅋ 

매우 쉽지만 그래도 설명을 좀 해드리자면 만약 어떤 스크립트를 min 파일로 따로 압축해서 저장하실거라면 

여기 사이트에서 작성하신 원본 코드 넣으시고 버튼 누르셔서 나온 소스코드를 

min 파일의 소스코드 복붙하시면 끝나는 부분입니다 ㅇㅅㅇ

반대로 min 파일만 있을때 이것의 원본 소스를 보고 싶으시면 이 사이트에 붙혀넣고 버튼 누르시면 간단하게 확인 할 수 있게 되죠~

수정하고 다시 min으로 만드셔도 될거구요 ㅎㅎ

min으로 만들게 되면 장점이 파일의 용량이 작아집니다! 쓸데 없는 공백을 제거하고 한두줄로 바뀌기 때문입니다.

CSS해석은 거기서 거기라.. 전~혀 받아오는 속도 체감은 안나는데 자바스크립트는 좀 큰 라이브러리에 min을 쓰니까 속도 차이가 좀 나더라구요! 아 bootstrap.css도 min 파일이 따로 들어있습니다.

나중에 한번에 속도개선하느라 고생마시구 미리미리 이런거라도 하면서 차근차근 개발해보는 것은 어떨까요?

도움이 되셨다면 아래 하트를 뿅..

▼▼▼▼▼▼