본문 바로가기

JavaScript 2

[JavaScript] 모든 제이쿼리 함수를 바닐라로 만들기 실험결과 프로젝트에서 다른 팀원들의 이해를 돕기 위해(실력 향상 목표로) 제이쿼리의 사용을 제한해서 사용했다. 그리고 팀원들이 작성하신 제이쿼리 문법이랑 섞이면서 어떤 곳은 제이쿼리 어떤 곳은 자바스크립트로 작성된 JS 파일이 됐다. 그리고 어떤 api는 $.ajax로, 어떤 api는 async/fetch로, 어떤 것은 fetch.then()으로 작성을 해서 다소 건드리기 난감한 코드 덩어리를 가지고 있었다. 1차 프로젝트 발표 이후 개선점을 짚으면서 우리 팀은 라이트하우스 스코어에 주목했고 하루 이틀 만에 퍼포먼스를 제외한 나머지 항목들은 올릴 수 있는 최대한까지 올려놓았다. 그런데 퍼포먼스는 진짜 뭘 해도 줄어들지 않았고, 폰트를 미리 다운받아 사용한다던가 이미지의 크기를 받을 때부터 제한해서 받는다던가 하는.. 2021. 10. 6.
[자바스크립트 웹개발] 마성의 룰렛은 처음이지? Math.random() 함수를 이용한 리스트형 룰렛 구현하기 어느 정도 사이트의 주요기능이 자리를 잡고, 엔터테인먼트적인 요소를 추가하고 싶어서 룰렛을 만들었습니다. 이름은 룰렛이지만, 개발자스럽게 리스트 형태로 for 문을 돌게 만들었어요!!ㅎㅎㅎ 딱 내 스타일.. 자바스크립트로 리스트를 셔플하는 메소드는 구글링해보면 대부분 비슷한 답을 가지고 있어요. 알고리즘에 관해 잘 아는 편은 아니지만 어느 정도 이해를 할 수 있는 선을 넘는 코드는 사용을 주저하는 편이라 개중에 가장 마음에 드는 셔플 함수를 골랐어요. // 리스트의 순서를 뒤섞는 함수입니다. function shuffle(array) { for (let i = array.length - 1; i > 0; i--) { let j = Math.floor(Math.random() * (i + 1)); [arr.. 2021. 9. 28.