-
-
Notifications
You must be signed in to change notification settings - Fork 3.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[p5.js KO] Create webgl_contribution_guide.md #6859
Conversation
6b9f95b로 1차 번역 커밋합니다! |
@ienground 넵 감사합니다!👍 확인해보겠습니다! 인화님 저는 이따 10시 이후에 윤영님 커밋 리뷰후 진행하겠습니다 @yinhwa |
아 그리고 본문 번역하면서 좀 의문스러운 사항들 대략적으로 따로 정리해두어서 같이 커멘트 남겨놓겠습니다! 리소스 → 일단은 참고 자료 코드베이스 → 번역 X 참고 자료 마지막에서 → go over 검토? 리뷰? context : 맥락 이긴 한데 국어 지문도 아니고 코딩에서는 그냥 컨텍스트라고 하기도 해서 일단은 컨텍스트라고 번역합니다. 계획 (Planning)에 Once agreed : 동의하면 이긴 한데 받아들여지면.. 이런 게 더 자연스러울 것 같긴 합니다. webgl / p5.js에서 material 번역 immediate mode : 즉시 방식이라는 말이 있고 실제로 사용하고 있어서 사용합니다. user-facing : 사용자 대면, 사용자 지향? 잘 나오지 않는 단어라.. 일단은 사용자 지향으로 했습니다. geometry input ? 함수와 기능의 맥락을 구분하기 쉽지 않음 framerate : 프레임 속도, 프레임 레이트, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@ienground
WebGL 내용이 다소 공학적인 것 같아 어려우셨을 텐데 잘 이해하시고 또 다른 분들이 이해하기 쉽게 번역해 주셔서 감사합니다..!
1차 리뷰는 완료하였고 이어서 @yinhwa 인화님께서 2차 리뷰 진행해 주실 예정입니다. 고생하셨습니다🙌
(1차 리뷰 소요 시간: 2024.03.18 09:30-11:50, 2시간 20분)
@@ -0,0 +1,156 @@ | |||
# WebGL 기여 안내 | |||
|
|||
이 페이지를 읽고 있다면, 아마도 WebGL 모드에서의 작업을 돕고 싶어하는 것이겠죠? 여러분의 기여에 다시 한 번 감사의 말씀을 드립니다. 이 페이지에서는 어떻게 WebGL 기여를 구성하는지를 설명하고, 변화를 주기 위한 몇 가지 팁을 제공합니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"이 페이지를 읽고 있다면, 아마도 WebGL 모드에서의 작업을 돕고 싶어하는 것이겠죠?"
-> "여러분이 이 페이지를 읽고 있다면, WebGL 모드에서의 작업에 도움을 주고 싶으신 것이겠죠?"
"어떻게 WebGL 기여를 구성하는지를 설명하고,"
-> "WebGL 기여가 어떻게 구성되었는지 설명하고"
좀 더 부드러운 어순으로 수정해보았습니다..! 'your help'를 '기여'라고 번역해주신 건 너무 좋은 것 같습니다 🤩
"변화를 주기 위한"(for making changes.)
-> 이 부분은 깃허브 레포에 기여한다는 의미인 것 같아, '변화를 준다'보다 '변경사항을 만들다'가 더 어울릴 것 같아 보이는데 어떨까요??
|
||
## 참고 자료 | ||
|
||
- WebGL 모드가 2D 모드와 어떻게 다른지 이해하려면 [p5.js WebGL 모드 아키텍쳐](webgl_mode_architecture.md)를 읽어보세요. 셰이더, 선 등에 대한 몇 가지 구현 세부 사항에 대한 가치 있는 자료가 됩니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"아키텍쳐(Architecture)"를 "구성과 동작원리"라고 번역하는 것은 어떨까요?
비개발자도 쉽게 이해하는 '아키텍처'의 개념
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
해당 부분은 기번역된 문서라 제목을 그대로 가져왔습니다.
|
||
- **시스템 수준 변화**란 코드에 광범위한 영향을 미치는 장기적 목표입니다. 이것은 실행에 옮기기 전 수많은 논의와 계획을 필요로 합니다. | ||
- **아직 해결책이 없는 버그**란 원인을 줄이기 위한 약간의 디버깅이 필요한 버그 신고입니다. 아직 해결될 준비가 되어 있지 않으며, 원인이 발견되면 이를 고치기 위한 최고의 해결책을 논의할 수 있게 됩니다. | ||
- **솔루션이 있지만 PR이 없는 버그**는 어떻게 해결할 지 결정되었으며 누구나 자유롭게 코드를 작성할 수 있습니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
18번줄에 해결책이라고 번역하신 것처럼 19번줄도 "해결책이 있지만" 으로 맞추는게 좋을 것 같아요!
- **솔루션이 있지만 PR이 없는 버그**는 어떻게 해결할 지 결정되었으며 누구나 자유롭게 코드를 작성할 수 있습니다. | ||
- **경미한 개선**이란 현재의 아키텍쳐 내에서 확실한 위치를 가지는 새로운 기능에 대한 이슈이며, 어떻게 맞출 것인지에 대한 논의를 하지 않아도 됩니다. 일단 이러한 기능이 가치가 있다고 동의하면, 이를 위한 코드를 자유롭게 작성할 수 있습니다. | ||
- **2D 기능**이란 p5.js에는 있지만 WebGL 모드에는 없는 기능입니다. 일단 구현되면, 이 기능은 2D 모드에서와 동일하게 작동될 것이라고 할 수 있습니다. 최적의 구현에 대해 논의할 필요가 있지만, 이에 대한 사용자 요구 사항은 명확합니다. | ||
- **모든 컨텍스트에서 작동하지 않는 기능**이란 WebGL 모드에 존재하지만 WebGL 모드를 사용할 수 있는 모든 방식으로 작동하지는 않는 기능입니다. 예를 들어, 일부 p5.js의 메소드는 2D 좌표계와 3D 좌표계에서 모두 작동하지만, 다른 메소드는 3D 좌표계에서 사용하면 중단될 수도 있습니다. 보통은 자유롭게 이 기능에 대한 작업을 시작할 수 있습니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
'컨텍스트' 는 '환경(Context)'으로 번역하는 것은 어떨까요?
내용 흐름상 사용자가 코드를 작성하는 환경(렌더링 모드 혹은 기능 구현)을 의미하는 것 같아서요..!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
좋은 것 같습니다 :)
|
||
p5.js의 함수를 사용할 수 있는 방법은 여러 가지가 있습니다. 모든 것을 수동으로 확인하는 것은 어려우므로, 가능한 곳에 단위 테스트(unit test)를 추가합니다. 그래야 새로운 변경점이 생겨도 단위 테스트를 통과한다면 아무 것도 망가뜨리지 않았다는 자신감을 가질 수 있기 때문입니다. | ||
|
||
새 테스트를 추가할 때, 기능이 2D 모드에서도 작동하는 경우 일관성을 확인하는 최고의 방법 중 하나 픽셀 결과물이 두 모드에서 동일한지를 확인하는 것입니다. 다음은 단위 테스트의 예시 중 하나입니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
하나
-> 하나는
}); | ||
``` | ||
|
||
2D 모드에서 안티앨리어싱을 끌 수 없고, WebGL 모드에서 안티앨리어싱은 종종 약간 다르기 때문에 항상 작동하지는 않습니다. 하지만 x 및 y축 상의 직선에 대해서는 작동합니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"항상" 앞에 "이 코드는"이 붙으면 좋을 것 같아요!
안티앨리어싱 -> 안티앨리어싱(계단 현상 방지 기술, antialiasing)으로 한글, 영문 같이 병기해주는 편이 좋을 것 같아요!
|
||
### 성능 테스트 | ||
|
||
p5.js가 가장 걱정하는 부분은 아니지만, 변경점이 성능을 크게 저하하지 않도록 노력하고 있습니다. 보통 하나는 변경이 이루어진 것이고 나머지 하나는 변경 없는 두 개의 테스트 스케치를 생성해서 이루어지고 있습니다. 그런 다음 두 프레임 속도를 비교합니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"보통 하나는 변경이 이루어진 것이고 나머지 하나는 변경 없는 두 개의 테스트..."
-> "보통 변경사항이 적용된 것과 변경사항이 적용되지 않은 것, 두 개의 테스트..."
좀 더 부드럽게 수정해보았습니다..!
|
||
성능 측정에 대한 몇 가지 조언을 드리자면, | ||
|
||
- 스케치 상단에서 `p5.disableFriendlyErrors = true`로 익숙한 오류를 비활성화해 보세요. (또는 익숙한 오류 시스템이 들어 있지 않은 `p5.min.js`를 테스트해보세요) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Friendly Error System-> 친절한 오류 메시지
p5.js FES을 참고하시면 FES는 p5.js 자체에서 제작한 시스템이라 "친절한"으로 번역해주시면 감사하겠습니다..!🤩
글자 렌더링을 위한 기능 및 유틸리티 클래스 | ||
|
||
|
||
## WebGL 변경 테스트 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
WebGL 변경 테스트 -> WebGL 변경사항 테스트
로 수정하면 좋을 것 같습니다..!
changes가 코드 변경사항을 의미하는 것 같아서요 🧐
@ienground @designerSejinOH 두 분 모두 빠른 작업 감사드립니다 😎 현우님께서 1차 리뷰 코멘트에 대한 추가 commit 후에 2차 리뷰 시작할 예정인 점 말씀드립니다! |
말씀하신 부분이랑 기타 읽으면서 조금 부자연스러운 부분들 수정합니다!
@ienground 현우님 빠른 수정 감사드려요! 저는 오늘 밤 10시 2차 리뷰 진행 예정인 점 말씀드리며, 특별한 이상없으면 approve 처리 하겠습니다 :) @designerSejinOH |
@designerSejinOH @yinhwa 혹시 권한 제대로 잘 들어갔을까요...? |
@ienground 세진님은 수정잘되시는것같은데 저는 초대수락해도 수정권한이 안생겨서 왜그러는건지 곧 확인해보려구요!! 😂😂 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@ienground 현우님 2차 리뷰 완료하였습니다! 간단한 내용들이니 한번 살펴보시고 추가 커밋해주시면 곧바로 승인하겠습니다 :) 현우님, 세진님 정말 고생많으셨습니다! 감사합니다🤩🎉 (2차 리뷰 소요시간: 11:52-12:23, 약 30분) @designerSejinOH
2차 피드백 반영하여 수정합니다.
@yinhwa 님 피드백 반영하여 수정, 커밋합니다. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thank you @ienground everything looks great!
@Qianqianye @limzykenneth we're ready to merge here :)
Looks great, thanks @ienground @designerSejinOH @yinhwa 💖 |
I've put up a pull request to add @ienground! 🎉 |
Changes:
webgl_contribution_guide.md 생성
PR Checklist
npm run lint
passes